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 多行文本框(textarea)高度变化
Jul 03 Javascript
js带按钮的提示框可供选择示例代码
Sep 17 Javascript
jquery实现瀑布流效果分享
Mar 26 Javascript
JavaScript中如何通过arguments对象实现对象的重载
May 12 Javascript
通过jquery 获取URL参数并进行转码
Aug 18 Javascript
高效利用Angular中内置服务$http、$location等
Mar 22 Javascript
js实现纯前端的图片预览
Apr 27 Javascript
JavaScript数据类型转换的注意事项
Jul 31 Javascript
JS实现页面打印(整体、局部)
Aug 18 Javascript
Nuxt升级2.0.0时出现的问题(小结)
Oct 08 Javascript
javascript实现简易的计算器
Jan 17 Javascript
JavaScript实现图片合成下载的示例
Nov 19 Javascript
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控制用户的浏览器--ob*函数的使用说明
2007/03/16 PHP
简单的php 验证图片生成函数
2009/05/21 PHP
详解php的魔术方法__get()和__set()使用介绍
2012/09/19 PHP
php抓取页面的几种方法详解
2013/06/17 PHP
解析php常用image图像函数集
2013/06/24 PHP
jQuery maxlength文本字数限制插件
2010/04/16 Javascript
jQuery设置指定网页元素宽度和高度的方法
2015/03/25 Javascript
DEDECMS如何为文章添加HOT NEW标志图片
2015/08/14 Javascript
jQuery将表单序列化成一个Object对象的实例
2016/11/29 Javascript
JS基于面向对象实现的拖拽功能示例
2016/12/20 Javascript
Angular2 路由问题修复详解
2017/03/01 Javascript
Angular2的管道Pipe的使用方法
2017/11/07 Javascript
vue单页缓存方案分析及实现
2018/09/25 Javascript
Vue中keep-alive组件的深入理解
2020/08/23 Javascript
如何阻止移动端浏览器点击图片浏览
2020/08/29 Javascript
javascript中导出与导入实现模块化管理教程
2020/12/03 Javascript
[50:04]DOTA2上海特级锦标赛D组小组赛#2 Liquid VS VP第二局
2016/02/28 DOTA
详解Python读取配置文件模块ConfigParser
2017/05/11 Python
Python编写登陆接口的方法
2017/07/10 Python
python中闭包Closure函数作为返回值的方法示例
2017/12/17 Python
python3爬取淘宝信息代码分析
2018/02/10 Python
使用 Python 实现文件递归遍历的三种方式
2018/07/18 Python
python导入不同目录下的自定义模块过程解析
2019/11/18 Python
python tornado修改log输出方式
2019/11/18 Python
PyCharm最新激活码(2020/10/27全网最新)
2020/10/27 Python
CSS3之2D与3D变换的实现方法
2019/01/28 HTML / CSS
德国婴儿服装和婴儿用品购买网站:Baby Sweets
2019/12/08 全球购物
如何高效率的查找一个月以内的数据
2012/04/15 面试题
顶撞老师检讨书
2014/02/07 职场文书
《分一分》教学反思
2014/04/13 职场文书
高中教师考核方案
2014/05/18 职场文书
试用期员工工作自我评价
2014/09/10 职场文书
演讲比赛主持词
2015/06/29 职场文书
微软官方消息,在 2023 年 4 月 11 日之后微软将不再为 Office 2013 和 Skype for Business 2015 提供安全更新
2022/04/21 数码科技
Python四款GUI图形界面库介绍
2022/06/05 Python
kubernetes集群搭建Zabbix监控平台的详细过程
2022/07/07 Servers