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 相关文章推荐
用js实现的仿sohu博客更换页面风格(简单版)
Mar 22 Javascript
JS中setInterval、setTimeout不能传递带参数的函数的解决方案
Apr 28 Javascript
jQuery判断checkbox是否选中的小例子
Dec 02 Javascript
使用js实现按钮控制文本框加1减1应用于小时+分钟
Dec 09 Javascript
JavaScript中this的9种应用场景及三种复合应用场景
Sep 12 Javascript
用JS生成UUID的方法实例
Mar 30 Javascript
javascript的理解及经典案例分析
May 20 Javascript
javaScript 事件绑定、事件冒泡、事件捕获和事件执行顺序整理总结
Oct 10 Javascript
基于vue2.0动态组件及render详解
Mar 17 Javascript
JS实现点击按钮随机生成可拖动的不同颜色块示例
Jan 30 Javascript
微信小程序基于ColorUI构建皮皮虾短视频去水印组件
Nov 04 Javascript
Vue elementUI表单嵌套表格并对每行进行校验详解
Feb 18 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 无限级分类学习参考之对ecshop无限级分类的解析 带详细注释
2010/03/23 PHP
php cookie工作原理与实例详解
2016/07/18 PHP
js数字输入框(包括最大值最小值限制和四舍五入)
2009/11/24 Javascript
JavaScript mapreduce工作原理简析
2012/11/25 Javascript
jquery中交替点击事件的实现代码
2014/02/14 Javascript
DIV始终居中的js代码
2014/02/17 Javascript
jquery组件使用中遇到的问题整理及解决
2014/02/21 Javascript
浅谈javascript中自定义模版
2015/01/29 Javascript
JavaScript分页功能的实现方法
2015/04/25 Javascript
NodeJs中的VM模块详解
2015/05/06 NodeJs
js实现商品抛物线加入购物车特效
2020/11/18 Javascript
JS+HTML5手机开发之滚动和惯性缓动实现方法分析
2016/06/12 Javascript
微信小程序 基础知识css样式media标签
2017/02/15 Javascript
fckeditor部署到weblogic出现xml无法读取及样式不能显示问题的解决方法
2017/03/24 Javascript
使用bootstraptable插件实现表格记录的查询、分页、排序操作
2017/08/06 Javascript
原生JS实现移动端web轮播图详解(结合Tween算法造轮子)
2017/09/10 Javascript
Webpack打包字体font-awesome的方法示例
2018/04/26 Javascript
JavaScript中set与get方法用法示例
2018/08/15 Javascript
微信小程序自定义音乐进度条的实例代码
2018/08/28 Javascript
JS面向对象编程基础篇(二) 封装操作实例详解
2020/03/03 Javascript
Javascript执行流程细节原理解析
2020/05/14 Javascript
javascript实现雪花飘落效果
2020/08/19 Javascript
python利用beautifulSoup实现爬虫
2014/09/29 Python
Python多线程实现同步的四种方式
2017/05/02 Python
urllib和BeautifulSoup爬取维基百科的词条简单实例
2018/01/17 Python
Python对列表的操作知识点详解
2019/08/20 Python
Expedia韩国官网:亚洲发展最快的在线旅游门户网站
2018/02/26 全球购物
金融学专业大学生职业生涯规划
2014/03/07 职场文书
仓库文员岗位职责
2014/04/06 职场文书
心得体会的写法
2014/09/05 职场文书
九一八事变纪念日演讲稿
2014/09/14 职场文书
2014年药店店长工作总结
2014/11/17 职场文书
大学考试作弊检讨书
2015/05/06 职场文书
音乐会主持人开场白
2015/05/28 职场文书
在vue中import()语法不能传入变量的问题及解决
2022/04/01 Vue.js
CentOS安装Nginx并部署vue
2022/04/12 Servers