js触发select onchange事件的小技巧
更新时间：2014年08月05日 10:27:25 投稿：whsnow
select 或text的onchange事件需要手动改变select或text的值才能触发，下面有个不错的方法可以通过js触发select onchange事件
select 或text的onchange事件需要手动（通过键盘输入）改变select或text的值才能触发，如果在js中给select或text赋值，则无法触发onchang事件，
例如，在页面加载完成以后，需要触发一个onChange事件，在js中用document.getElementById("province").value="湖北";直接给select或text赋值是不行的，要想实现手动触发onchange事件，需要在js给select赋值后，加入下面的语句
document.getElementById("province").fireEvent('onchange') 来实现,
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
var provinces = new Array();
provinces["湖北"] = ["武汉","襄阳","随州","宜昌","十堰"];
provinces["四川"] = ["成都","内江","达州"];
provinces["河南"] =["郑州","南阳","信阳","漯河"];
function changeProvince()
{
var prov = document.getElementById("province").value;
var city =document.getElementById("city");
city.options.length =0;
for(var i in provinces[prov])
{
city.options.add(new Option(provinces[prov][i],provinces[prov][i]));
}
}
window.onload = function(){
var province = document.getElementById("province");
for(var index in provinces)
{
//alert(index);
province.options.add(new Option(index,index));
}
province.fireEvent("onchange");
};
</script>
</head>
<body>
省份:<select id="province" onchange= "changeProvince()"></select>
城市:<select id="city"></select>
</body>
</html>
相关文章
这篇文章主要介绍了BootStrap表单控件之文本域textarea,需要的朋友可以参考下2017-05-05
这篇文章主要是对利用javaScript实现点击输入框弹出窗体选择信息进的实例行了详细的介绍，需要的朋友可以过来参考下，希望对大家有所帮助2013-12-12
这篇文章主要介绍了js判断子窗体是否关闭的方法,涉及javascript针对子窗体的获取与属性判定技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-08-08
这篇文章主要介绍了JavaScript判断是否为数字的多种方法小结,本文给大家分享三种方法,结合实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧2024-01-01
不间断横向滚动想必大家在很多场合都有见过吧，本文也使用DIV+CSS+JS实现一个，感兴趣的你可以参考下哈，希望对你学习有所帮助2013-03-03
这篇文章给大家介绍了如何利用Javascript实现类似Excel的数据透视分析功能，感兴趣的朋友们可以参考借鉴，下面来一起看看吧。2016-09-09
今天小编就为大家分享一篇关于js中数组对象去重的两种方法，小编觉得内容挺不错的，现在分享给大家，具有很好的参考价值，需要的朋友一起跟随小编来看看吧2019-01-01
这篇文章主要介绍了详解 Map 和 WeakMap 区别以及使用场景,Map本质上是一个键值对的集合,WeakMap 只能将对象作为键名,下面来一起俩姐更多详细内容吧，希望这一篇文章能让你对 Map 有更好的理解，或者能够帮你理解 Map 和 WeakMap2022-01-01
调整小数的格式，如保留小数点后两位等等在开发过程中经常会遇到，下面本文搜集了一些不错的实现方法与分享2014-05-05
UniApp中Scroll-View设置占满下方剩余高度的方法记录
在使用uniapp开发项目过程中有时候会想让一些组件占有屏幕剩余的高度,下面这篇文章主要给大家介绍了关于UniApp中Scroll-View设置占满下方剩余高度的方法,需要的朋友可以参考下2023-04-04
最新评论