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 多浏览器 事件大全
Mar 23 Javascript
用jquery和json从后台获得数据集的代码
Nov 07 Javascript
Jquery Validate 正则表达式实用验证代码大全
Aug 23 Javascript
使用jQuery Rotare实现微信大转盘抽奖功能
Jun 20 Javascript
在线引用最新jquery文件的实现方法
Aug 26 Javascript
React操作真实DOM实现动态吸底部的示例
Oct 23 Javascript
基于Datatables跳转到指定页的简单实例
Nov 09 Javascript
详解vue.js之props传递参数
Dec 12 Javascript
vue异步加载高德地图的实现
Jun 19 Javascript
element-ui中的select下拉列表设置默认值方法
Aug 24 Javascript
webpack 如何解析代码模块路径的实现
Sep 04 Javascript
vue选项卡切换的实现案例
Apr 11 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数组函数序列之array_sum() - 计算数组元素值之和
2011/10/29 PHP
thinkphp5.0自定义验证规则使用方法
2017/11/16 PHP
快速解决PHP调用Word组件DCOM权限的问题
2017/12/27 PHP
PHP检测接口Traversable用法详解
2017/12/29 PHP
用JavaScript 处理 URL 的两个函数代码
2007/08/13 Javascript
js 文本滚动效果的实例代码
2013/08/17 Javascript
jquery删除指定子元素代码实例
2015/01/13 Javascript
ajax如何实现页面局部跳转与结果返回
2015/08/24 Javascript
JS+CSS实现仿支付宝菜单选中效果代码
2015/09/25 Javascript
对象题目的一个坑 理解Javascript对象
2015/12/22 Javascript
webpack+vue.js快速入门教程
2016/10/12 Javascript
js中获取 table节点各tr及td的内容简单实例
2016/10/14 Javascript
Angular JS 生成动态二维码的方法
2017/02/23 Javascript
浅谈Vue2.0中v-for迭代语法的变化(key、index)
2018/03/06 Javascript
Vue 项目中遇到的跨域问题及解决方法(后台php)
2018/03/28 Javascript
全面了解JavaScript的作用域链
2019/04/03 Javascript
express如何解决ajax跨域访问session失效问题详解
2019/06/20 Javascript
vue项目强制清除页面缓存的例子
2019/11/06 Javascript
vue+webpack dev本地调试全局样式引用失效的解决方案
2019/11/12 Javascript
vue实现pdf文档在线预览功能
2019/11/26 Javascript
jQuery实现带进度条的轮播图
2020/09/13 jQuery
python中 logging的使用详解
2017/10/25 Python
利用pandas读取中文数据集的方法
2018/07/25 Python
Python利用lxml模块爬取豆瓣读书排行榜的方法与分析
2019/04/15 Python
python Django编写接口并用Jmeter测试的方法
2019/07/31 Python
Python List列表对象内置方法实例详解
2019/10/22 Python
python3中rank函数的用法
2019/11/27 Python
Python检测端口IP字符串是否合法
2020/06/05 Python
详解python 内存优化
2020/08/17 Python
Numpy中np.max的用法及np.maximum区别
2020/11/27 Python
Harrods美国:英国最大的百货公司
2018/11/04 全球购物
工程资料员岗位职责
2014/03/10 职场文书
公证处委托书
2015/01/28 职场文书
2015年毕业生自荐信范文
2015/03/24 职场文书
2016年社区党支部公开承诺书
2016/03/25 职场文书
全网非常详细的pytest配置文件
2022/07/15 Python