用js传递value默认值的示例代码

 更新时间:2014年09月11日 15:48:02   投稿:whsnow  
这篇文章主要介绍了用js传递value默认值的简单实现,很简单但比较实用,需要的朋友可以参考下

需求和代码如下:

“这是我的代码:”

<input type="text" id="price2" value="333"/>
<input type="text" id="trueprice" value="" />
<script type="text/javascript">
document.getElementById("price2").onkeyup = function() {
document.getElementById("trueprice").value = this.value;
}
</script>

问题:现在打开这个页面,trueprice的值默认是空的,怎样才能实现默认打开这个页面trueprice就已经和price2一样了呢?(price2是一个动态的数值)
<input type=”text” id=”trueprice” value=”” />是固定不可以修改的

我的一个简单实现:

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="content-type" content="text/html;charset=utf-8">

<title>Test</title>

</head>

<body>

<input type="text" id="price2" value="333" onkeyup="test(this.value);"/>

<input type="text" id="trueprice" value="" />

<script type="text/javascript">

var price2 = document.getElementById("price2").value;

document.getElementById("trueprice").value = price2;

function test (defaultVal) {

document.getElementById("trueprice").value = defaultVal;

}

</script>

</body>

</html>

效果:



在第一个文本框中输入的内容能同步到第二个文本框

相关文章

  • flexigrid 参数说明

    flexigrid 参数说明

    flexigrid 参数说明,需要的朋友可以参考下。
    2010-11-11
  • js打开windows上的可执行文件示例

    js打开windows上的可执行文件示例

    这篇文章主要介绍了js如何打开windows上的可执行文件,需要的朋友可以参考下
    2014-05-05
  • typescript返回值类型和参数类型的具体使用

    typescript返回值类型和参数类型的具体使用

    本文主要介绍了typescript返回值类型和参数类型的具体使用文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-06-06
  • 深度解析JavaScript中的filter()方法

    深度解析JavaScript中的filter()方法

    在JavaScript中,filter()是一个数组方法,用于从数组中过滤出符合特定条件的元素,并返回一个新数组,本文将带大家深度解析JavaScript中的filter()方法,需要的朋友可以参考下
    2023-09-09
  • PHP自动加载autoload和命名空间的应用小结

    PHP自动加载autoload和命名空间的应用小结

    PHP的自动加载就是我们加载实例化类的时候,不需要手动去写require来导入这个class.php文件,程序自动帮我们加载导入进来这.篇文章主要介绍了PHP自动加载autoload和命名空的应用,需要的朋友可以参考下
    2017-12-12
  • JS实现超炫网页烟花动画效果的方法

    JS实现超炫网页烟花动画效果的方法

    这篇文章主要介绍了JS实现超炫网页烟花动画效果的方法,实例分析了javascript实现烟花动画效果的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-03-03
  • jQuery实现动态文字搜索功能

    jQuery实现动态文字搜索功能

    本文主要介绍了jQuery实现动态文字搜索功能的分析过程,文章底部提供了完整的代码。具有一定的参考价值,下面跟着小编一起来看下吧
    2017-01-01
  • 微信小程序block的使用教程

    微信小程序block的使用教程

    这篇文章主要介绍了微信小程序block的使用 ,微信小程序最近非常火热,实现起来也很简单,只要block就可以实现,需要的朋友可以参考下
    2018-04-04
  • js显示当前日期时间和星期几

    js显示当前日期时间和星期几

    这篇文章主要介绍了js获取当前日期时间同时显示星期的方法,具有参考价值,感兴趣的小伙伴们可以参考一下
    2015-10-10
  • 基于JavaScript实现类似于百度学术高级检索功能

    基于JavaScript实现类似于百度学术高级检索功能

    这篇文章主要介绍了基于JavaScript实现类似于百度学术高级检索功能 的相关资料,需要的朋友可以参考下
    2016-03-03

最新评论