jquery trigger实现联动的方法


Posted in Javascript onFebruary 29, 2016

本文实例讲述了jquery trigger实现联动的方法。分享给大家供大家参考,具体如下:

<html>
<head>
<title>testing</title>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
  $("#Provinces").change(function (e,cityValue) {
    if ($(this).val() == "1") {
      $("#City").html("<option value='1' >长沙</option><option value='2' >衡阳</option>");
    } else {
      $("#City").html("<option value='1' >武汉</option><option value='2' >襄阳</option>");
    }
    if (typeof (cityValue) != "undefined") {
      $("#City").val(cityValue);
    }
  });
});
function test() {
  $("#Provinces").val("2");
  $("#Provinces").trigger("change","2");
}
</script>
</head>
<body>
  省:
  <select id="Provinces" >
    <option value="1" >湖南</option>
    <option value="2" >湖北</option>
  </select><br />
  市:
  <select id="City">
    <option value="1" >长沙</option>
    <option value="2" >衡阳</option>
  </select><br />
  <input type="button" value="设置成湖北襄阳" onclick="test()" />
</body>
</html>

众所周知, trigger 是异步的, 在其后面执行的代码可能会跑到它前面去执行, 上面的代码就避免了这一点。

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
详解AngularJS中的表格使用
Jun 16 Javascript
JavaScript访问字符串中单个字符的两种方法
Jul 03 Javascript
JS实现新浪微博效果带遮罩层的弹出框代码
Oct 12 Javascript
JavaScript常用代码书写规范的超全面总结
Sep 11 Javascript
微信小程序 绘图之饼图实现
Oct 24 Javascript
简单介绍react redux的中间件的使用
Apr 06 Javascript
详解如何在nuxt中添加proxyTable代理
Aug 10 Javascript
深入浅析angular和vue还有jquery的区别
Aug 13 jQuery
浅析vue-router原理
Oct 19 Javascript
Angular6新特性之Angular Material
Dec 28 Javascript
node.js中path路径模块的使用方法实例分析
Feb 13 Javascript
layui实现显示数据表格、搜索和修改功能示例
Jun 03 Javascript
基于Javascript实现返回顶部按钮
Feb 29 #Javascript
JavaScript实现斗地主游戏的思路
Feb 29 #Javascript
jQuery取消特定的click事件
Feb 29 #Javascript
JavaScript+CSS实现的可折叠二级菜单实例
Feb 29 #Javascript
JS三级可折叠菜单实现方法
Feb 29 #Javascript
精通JavaScript的this关键字
May 28 #Javascript
javascript正则表达式总结
Feb 29 #Javascript
You might like
用PHP读注册表
2006/10/09 PHP
php 字符串压缩方法比较示例
2014/01/23 PHP
全面解读PHP的人气开发框架Laravel
2015/10/15 PHP
可兼容php5与php7的cURL文件上传功能实例分析
2018/05/11 PHP
PHP实现的微信公众号扫码模拟登录功能示例
2019/05/30 PHP
走出JavaScript初学困境—js初学
2008/12/29 Javascript
jQuery中json对象的复制方式介绍(数组及对象)
2013/06/08 Javascript
jquery实现按Enter键触发事件示例
2013/09/10 Javascript
window.onload追加函数使用示例
2014/03/03 Javascript
node.js中的fs.read方法使用说明
2014/12/17 Javascript
jQuery图片轮播滚动切换代码分享
2020/04/20 Javascript
Vue路由跳转问题记录详解
2017/06/15 Javascript
JavaScript之promise_动力节点Java学院整理
2017/07/03 Javascript
基于Vue2.X的路由和钩子函数详解
2018/02/09 Javascript
vue中本地静态图片路径写法
2018/03/06 Javascript
JavaScript实现连连看连线算法
2019/01/05 Javascript
JS实现4位随机验证码
2020/10/19 Javascript
python连接sql server乱码的解决方法
2013/01/28 Python
Python socket.error: [Errno 98] Address already in use的原因和解决方法
2014/08/25 Python
浅析Python中的getattr(),setattr(),delattr(),hasattr()
2016/06/14 Python
python3.6连接MySQL和表的创建与删除实例代码
2017/12/28 Python
解决Mac安装scrapy失败的问题
2018/06/13 Python
python学习之hook钩子的原理和使用
2018/10/25 Python
python使用matplotlib绘制热图
2018/11/07 Python
python装饰器相当于函数的调用方式
2019/12/27 Python
CSS3中HSL和HSLA的简单使用示例
2015/07/14 HTML / CSS
html5时钟实现代码
2010/10/22 HTML / CSS
法国时尚童装网站:Melijoe
2016/08/10 全球购物
美国领先的商务贺卡出版商:The Gallery Collection
2018/02/13 全球购物
社区健康教育实施方案
2014/03/18 职场文书
学校实习推荐信
2015/03/27 职场文书
中学语文教学反思
2016/02/16 职场文书
goland 清除所有的默认设置操作
2021/04/28 Golang
详解Vue的sync修饰符
2021/05/15 Vue.js
MySQL中distinct和count(*)的使用方法比较
2021/05/26 MySQL
利用JavaScript写一个简单计算器
2021/11/27 Javascript