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 相关文章推荐
表单的焦点顺序tabindex和对应enter键提交
Jan 04 Javascript
拖动table标题实现改变td的大小(css+js代码)
Apr 16 Javascript
javascript将相对路径转绝对路径示例
Mar 14 Javascript
JS获得选取checkbox整行数据的方法
Jan 28 Javascript
基于jQuery和CSS3制作响应式水平时间轴附源码下载
Dec 20 Javascript
jQuery.Callbacks()回调函数队列用法详解
Jun 14 Javascript
移动端Ionic App 资讯上下循环滚动的实现代码(跑马灯效果)
Aug 29 Javascript
Bootstrap 3多级下拉菜单实例
Nov 23 Javascript
Vue异步组件处理路由组件加载状态的解决方案
Sep 07 Javascript
JS中超越现实的匿名函数用法实例分析
Jun 21 Javascript
layui table 列宽百分比显示的实现方法
Sep 28 Javascript
详解Vue的options
May 15 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
session在PHP大型web应用中的使用
2011/06/25 PHP
php 操作符与控制结构
2012/03/07 PHP
PHP获取客户端真实IP地址的5种情况分析和实现代码
2014/07/08 PHP
读jQuery之十 事件模块概述
2011/06/27 Javascript
瀑布流布局并自动加载实现代码
2013/03/12 Javascript
鼠标移到div,浮层显示明细,弹出层与div的上边距左边距重合(示例代码)
2013/12/14 Javascript
js操作css属性实现div层展开关闭效果的方法
2015/05/11 Javascript
理解javascript闭包
2015/12/15 Javascript
微信小程序 常用工具类详解及实例
2017/02/15 Javascript
老生常谈js数据类型
2017/08/03 Javascript
JS禁止浏览器右键查看元素或按F12审查元素自动关闭页面示例代码
2017/09/07 Javascript
通过一个简单的例子学会vuex与模块化
2017/11/22 Javascript
vue + element-ui的分页问题实现
2018/12/17 Javascript
javascript之分片上传,断点续传的实际项目实现详解
2019/09/05 Javascript
JavaScript获取页面元素的常用方法详解
2019/09/28 Javascript
浅谈如何优雅处理JavaScript异步错误
2019/11/12 Javascript
[01:02:26]DOTA2-DPC中国联赛 正赛 SAG vs RNG BO3 第二场 1月18日
2021/03/11 DOTA
Python后台开发Django会话控制的实现
2019/04/15 Python
Python3.5内置模块之shelve模块、xml模块、configparser模块、hashlib、hmac模块用法分析
2019/04/27 Python
Django中Middleware中的函数详解
2019/07/18 Python
QML使用Python的函数过程解析
2019/09/26 Python
Python zip函数打包元素实例解析
2019/12/11 Python
Python requests.post方法中data与json参数区别详解
2020/04/30 Python
tensorflow dataset.shuffle、dataset.batch、dataset.repeat顺序区别详解
2020/06/03 Python
浅谈sklearn中predict与predict_proba区别
2020/06/28 Python
HTML5实现视频直播功能思路详解
2017/11/16 HTML / CSS
Monnier Frères美国官网:法国知名奢侈品网站
2016/11/22 全球购物
毕业生找工作的自我评价
2013/10/18 职场文书
闭幕式主持词
2014/04/02 职场文书
行政内勤岗位职责
2014/04/07 职场文书
2014年幼儿园工作总结
2014/11/10 职场文书
基于flask实现五子棋小游戏
2021/05/25 Python
教你一步步实现一个简易promise
2021/11/02 Javascript
Spring Boot实战解决高并发数据入库之 Redis 缓存+MySQL 批量入库问题
2022/02/12 Redis
Python学习之时间包使用教程详解
2022/03/21 Python
vue css 相对路径导入问题级踩坑记录
2022/06/05 Vue.js