js 触发select onchange事件代码


Posted in Javascript onMarch 20, 2014

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>
Javascript 相关文章推荐
Javascript 圆角div的实现代码
Oct 15 Javascript
基于jquery的商品展示放大镜
Aug 07 Javascript
js+xml生成级联下拉框代码
Jul 24 Javascript
formvalidator验证插件中有关ajax验证问题
Jan 04 Javascript
js中reverse函数的用法详解
Dec 26 Javascript
js中的时间转换—毫秒转换成日期时间的示例代码
Jan 26 Javascript
JavaScript获得指定对象大小的方法
Jul 01 Javascript
jQuery图片左右滚动代码 有左右按钮实例
Jun 20 Javascript
Vue.js系列之项目搭建(1)
Jan 03 Javascript
微信小程序 在线支付功能的实现
Mar 14 Javascript
详解Java中String JSONObject JSONArray List转换
Nov 13 Javascript
vue 实现图片懒加载功能
Dec 31 Vue.js
ie9 提示'console' 未定义问题的解决方法
Mar 20 #Javascript
jQuery的选择器中的通配符使用介绍
Mar 20 #Javascript
$.each与$().each的区别示例介绍
Mar 20 #Javascript
js中document.write使用过程中的一点疑问解答
Mar 20 #Javascript
js图片延迟技术一般的思路与示例
Mar 20 #Javascript
可恶的ie8提示缺少id未定义
Mar 20 #Javascript
JavaScript截取字符串的Slice、Substring、Substr函数详解和比较
Mar 20 #Javascript
You might like
PHP实现的登录页面信息提示功能示例
2017/07/24 PHP
Laravel5.1 框架响应基本用法实例分析
2020/01/04 PHP
javascript中的一些注意事项 更新中
2010/12/06 Javascript
一个简单的瀑布流效果(主体形式自写)
2013/05/27 Javascript
LABjs、RequireJS、SeaJS的区别
2014/03/04 Javascript
javascript动态判断html元素并执行不同的操作
2014/06/16 Javascript
javascript初学者常用技巧
2014/09/02 Javascript
jquery实现两个图片渐变切换效果的方法
2015/06/25 Javascript
深入浅析AngularJS中的module(模块)
2016/01/04 Javascript
JavaScript判断用户名和密码不能为空的实现代码
2016/05/16 Javascript
HTML5+jQuery插件Quicksand实现超酷的星际争霸2兵种分类展示效果(附demo源码下载)
2016/05/25 Javascript
Windows下快速搭建NodeJS本地服务器的步骤
2017/08/09 NodeJs
JS传播事件、取消事件默认行为、阻止事件传播详解
2017/08/14 Javascript
JS获取字符对应的ASCII码实例
2017/09/10 Javascript
快速搭建vue2.0+boostrap项目的方法
2018/04/09 Javascript
小试小程序云开发(小结)
2019/06/06 Javascript
vue页面更新patch的实现示例
2020/03/25 Javascript
微信小程序以ssm做后台开发的实现示例
2020/04/08 Javascript
[02:27]《DAC最前线》之附加赛征程
2015/01/29 DOTA
[01:52]2020年DOTA2 TI10夏季活动预告片
2020/07/15 DOTA
python通过邮件服务器端口发送邮件的方法
2015/04/30 Python
Python基于PyGraphics包实现图片截取功能的方法
2017/12/21 Python
Python实现钉钉发送报警消息的方法
2019/02/20 Python
Django 简单实现分页与搜索功能的示例代码
2019/11/07 Python
Python3中的f-Strings增强版字符串格式化方法
2020/03/04 Python
html5 实现客户端验证上传文件的大小(简单实例)
2016/05/15 HTML / CSS
大学生就业自我鉴定
2013/10/26 职场文书
政府采购方案
2014/06/12 职场文书
工作失误检讨书范文
2015/01/26 职场文书
2015年大学宣传部工作总结
2015/05/26 职场文书
少先队中队工作总结
2015/08/14 职场文书
聘任书范文大全
2015/09/21 职场文书
2019年幼儿园家长接送责任书
2019/10/29 职场文书
Matplotlib绘制混淆矩阵的实现
2021/05/27 Python
如何设置多台电脑共享打印机?多台电脑共享打印机的方法
2022/04/08 数码科技
搭建Yolov5服务器
2022/04/30 Servers