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 相关文章推荐
jquery CSS选择器笔记
Mar 29 Javascript
javascript XMLHttpRequest对象全面剖析
Apr 24 Javascript
javascript圆盘抽奖程序实现原理和完整代码例子
Jun 03 Javascript
jQuery中:text选择器用法实例
Jan 03 Javascript
canvas实现粒子时钟效果
Feb 06 Javascript
微信小程序城市定位的实现实例(获取当前所在国家城市信息)
May 17 Javascript
深究AngularJS如何获取input的焦点(自定义指令)
Jun 12 Javascript
Vue2 SSR渲染根据不同页面修改 meta
Nov 20 Javascript
Vue press 支持图片放大功能的实例代码
Nov 09 Javascript
vue实现列表滚动的过渡动画
Jun 29 Javascript
解决VUE 在IE下出现ReferenceError: Promise未定义的问题
Nov 07 Javascript
vue.js 使用原生js实现轮播图
Apr 26 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处理大量表单字段的便捷方法
2015/02/07 PHP
PHP常见字符串操作函数与用法总结
2019/03/04 PHP
Prototype 1.5.0_rc1 及 Prototype 1.5.0 Pre0小抄本
2006/09/22 Javascript
用JavaScript实现单继承和多继承的简单方法
2009/03/29 Javascript
jQuery 连续列表实现代码
2009/12/21 Javascript
NodeJS框架Express的模板视图机制分析
2011/07/19 NodeJs
json数据的列循环示例
2013/09/06 Javascript
javascript计算当月剩余天数(天数计算器)示例代码
2014/01/09 Javascript
js实现背景图片感应鼠标变化的方法
2015/02/28 Javascript
用原生js统计文本行数的简单示例
2016/08/19 Javascript
JavaScript中原型链存在的问题解析
2016/09/25 Javascript
jQuery ajax 当async为false时解决同步操作失败的问题
2016/11/18 Javascript
浅谈javascript中执行环境(作用域)与作用域链
2016/12/08 Javascript
jQuery访问浏览器本地存储cookie、localStorage和sessionStorage的基本用法
2017/10/20 jQuery
浅谈Node 调试工具入门教程
2018/03/20 Javascript
node.js读取Excel数据(下载图片)的方法示例
2018/08/02 Javascript
js实现全选和全不选
2020/07/28 Javascript
js实现盒子移动动画效果
2020/08/09 Javascript
python中json格式数据输出的简单实现方法
2016/10/31 Python
浅谈Python中的zip()与*zip()函数详解
2018/02/24 Python
python如何实现数据的线性拟合
2019/07/19 Python
Python3网络爬虫开发实战之极验滑动验证码的识别
2019/08/02 Python
Django调用百度AI接口实现人脸注册登录代码实例
2020/04/23 Python
基于打开pycharm有带图片md文件卡死问题的解决
2020/04/24 Python
详解Pycharm第三方库的安装及使用方法
2020/12/29 Python
python 多线程爬取壁纸网站的示例
2021/02/20 Python
纯CSS实现右侧底部悬浮效果(悬浮QQ、微信、微博、邮箱等联系方式)
2015/04/24 HTML / CSS
俄罗斯药房连锁店:ASNA
2020/06/20 全球购物
考试作弊被抓检讨书
2014/01/10 职场文书
建筑工程材料员岗位职责
2015/04/11 职场文书
无工作证明怎么写
2015/06/15 职场文书
大学军训通讯稿
2015/07/18 职场文书
计算机教师工作总结
2015/08/13 职场文书
你会写请假条吗?
2019/06/26 职场文书
2019年亲子运动会口号
2019/10/11 职场文书
SQL中的连接查询详解
2022/06/21 SQL Server