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 相关文章推荐
一步一步教你写一个jQuery的插件教程(Plugin)
Sep 03 Javascript
js 获取屏幕各种宽高的方法(浏览器兼容)
May 15 Javascript
使用JQuery快速实现Tab的AJAX动态载入(实例讲解)
Dec 11 Javascript
javascript 小数取整简单实现方式
May 30 Javascript
angularjs基础教程
Dec 25 Javascript
jquery.form.js框架实现文件上传功能案例解析(springmvc)
May 26 Javascript
原生js编写基于面向对象的分页组件
Dec 05 Javascript
uni-app如何页面传参数的几种方法总结
Apr 28 Javascript
原生js实现轮播图特效
May 04 Javascript
记一次用ts+vuecli4重构项目的实现
May 21 Javascript
Vue如何跨组件传递Slot的实现
Dec 14 Vue.js
vue动态绑定style样式
Apr 20 Vue.js
基于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获取本周星期一具体日期的方法
2015/04/20 PHP
PHP htmlspecialchars()函数用法与实例讲解
2019/03/08 PHP
XML+XSL 与 HTML 两种方案的结合
2007/04/22 Javascript
JavaScript 学习笔记 Black.Caffeine 09.11.28
2009/11/30 Javascript
javascript下对于事件、事件流、事件触发的顺序随便说说
2010/07/17 Javascript
判断用户是否在线的代码
2011/03/05 Javascript
2014年50个程序员最适用的免费JQuery插件
2014/12/15 Javascript
JavaScript中的值类型转换介绍
2014/12/31 Javascript
使用jQuery实现WordPress中的Ctrl+Enter和@评论回复
2016/05/21 Javascript
JavaScript正则表达式小结(test|match|search|replace|split|exec)
2016/12/08 Javascript
原生js实现鼠标跟随效果
2017/02/28 Javascript
js中toString()和String()区别详解
2017/03/23 Javascript
JavaScript字符串检索字符的方法
2017/06/23 Javascript
node打造微信个人号机器人的方法示例
2018/04/26 Javascript
JS实现Cookie读、写、删除操作工具类示例
2018/08/28 Javascript
extract-text-webpack-plugin用法详解
2019/02/14 Javascript
Vue 数组和对象更新,但是页面没有刷新的解决方式
2019/11/09 Javascript
vue keep-alive列表页缓存 详情页返回上一页不刷新,定位到之前位置
2019/11/26 Javascript
JavaScript工具库MyTools详解
2020/01/01 Javascript
vue中使用WX-JSSDK的两种方法(推荐)
2020/01/18 Javascript
[50:22]完美盛典-2018年度红毯走秀
2018/12/16 DOTA
Python内置模块hashlib、hmac与uuid用法分析
2018/02/12 Python
python实现简单的文字识别
2018/11/27 Python
Python3常见函数range()用法详解
2019/12/30 Python
详解CSS3的perspective属性设置3D变换距离的方法
2016/05/23 HTML / CSS
html5定位并在百度地图上显示的示例
2014/04/27 HTML / CSS
html5简单示例_动力节点Java学院整理
2017/07/07 HTML / CSS
预订全球最佳旅行体验:Viator
2018/03/30 全球购物
Nike意大利官网:Nike.com IT
2020/01/19 全球购物
个人找工作的自我评价
2013/10/17 职场文书
大学生实习证明范本
2014/01/15 职场文书
商务考察邀请函范文
2014/01/21 职场文书
2014国庆节演讲稿:祖国在我心中(400字)
2014/09/25 职场文书
助学感谢信范文
2015/01/21 职场文书
基于Redis过期事件实现订单超时取消
2021/05/08 Redis
JavaScript数组reduce()方法的语法与实例解析
2021/07/07 Javascript