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 相关文章推荐
fckeditor粘贴Word时弹出窗口取消的方法
Oct 30 Javascript
DOM基础教程之使用DOM
Jan 19 Javascript
JS实现为表格动态添加标题的方法
Mar 31 Javascript
javascript cookie的简单应用
Feb 24 Javascript
Bootstrap多级导航栏(级联导航)的实现代码
Mar 08 Javascript
Javascript获取图片原始宽度和高度的方法详解
Sep 20 Javascript
JS中setTimeout和setInterval的最大延时值详解
Feb 13 Javascript
利用require.js与angular搭建spa应用的方法实例
Jul 19 Javascript
彻底理解js面向对象之继承
Feb 04 Javascript
Vue.js添加组件操作示例
Jun 13 Javascript
vue element-ui中table合计指定列求和实例
Nov 02 Javascript
vue backtop组件的实现完整代码
Apr 07 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常用技巧汇总
2016/03/04 PHP
php判断目录存在的简单方法
2019/09/26 PHP
使用TextRange获取输入框中光标的位置的代码
2007/03/08 Javascript
JQuery Tips(2) 关于$()包装集你不知道的
2009/12/14 Javascript
javascript动态添加表格数据行(ASP后台数据库保存例子)
2010/05/08 Javascript
jQuery的each终止或跳过示例代码
2013/12/12 Javascript
js图片自动轮播代码分享(js图片轮播)
2014/05/06 Javascript
JavaScript在IE和FF下的兼容性问题
2014/05/19 Javascript
javascript圆盘抽奖程序实现原理和完整代码例子
2014/06/03 Javascript
Js实现手机发送验证码时按钮延迟操作
2014/06/20 Javascript
jQuery validate插件实现ajax验证重复的2种方法
2016/01/22 Javascript
浅谈js构造函数的方法与原型prototype
2016/07/04 Javascript
Bootstrap基本样式学习笔记之按钮(4)
2016/12/07 Javascript
jQuery实现动态文字搜索功能
2017/01/05 Javascript
微信小程序 摇一摇抽奖简单实例实现代码
2017/01/09 Javascript
JS判断一个数是否是水仙花数
2017/06/11 Javascript
Chart.js 轻量级HTML5图表绘制工具库(知识整理)
2018/05/22 Javascript
基于three.js实现的3D粒子动效实例代码
2019/04/09 Javascript
element ui分页多选,翻页记忆的实例
2019/09/03 Javascript
Python Web框架Flask信号机制(signals)介绍
2015/01/01 Python
Python数据结构之翻转链表
2017/02/25 Python
Python MD5加密实例详解
2017/08/02 Python
详解python使用递归、尾递归、循环三种方式实现斐波那契数列
2018/01/16 Python
Python实现的文本对比报告生成工具示例
2018/05/22 Python
selenium+python自动化测试之多窗口切换
2019/01/23 Python
Python多进程multiprocessing、进程池用法实例分析
2020/03/24 Python
完美解决pyinstaller打包报错找不到依赖pypiwin32或pywin32-ctypes的错误
2020/04/01 Python
Python性能测试工具Locust安装及使用
2020/12/01 Python
澳大利亚香水在线:Price Rite Mart
2017/12/28 全球购物
网友共享的几个面试题关于Java和Unix等方面的
2016/09/08 面试题
学生社团文化节开幕式主持词
2014/03/28 职场文书
简洁的英文求职信范文
2014/05/03 职场文书
课外访万家心得体会
2014/09/03 职场文书
期末考试复习计划
2015/01/19 职场文书
邀请书模板
2015/02/02 职场文书
小学语文课《掌声》教学反思
2016/03/03 职场文书