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 Tabs插件宿主IFRAMES
Jan 01 Javascript
js+xml生成级联下拉框代码
Jul 24 Javascript
jquery使用淘宝接口跨域查询手机号码归属地实例
Nov 28 Javascript
addEventListener 的用法示例介绍
May 07 Javascript
js仿黑客帝国字母掉落效果代码分享
Nov 08 Javascript
jQuery+HTML5实现图片上传前预览效果
Aug 20 Javascript
Angular外部使用js调用Angular控制器中的函数方法或变量用法示例
Aug 05 Javascript
详解vue中引入stylus及报错解决方法
Sep 22 Javascript
Vuex入门到上手教程
Jun 20 Javascript
微信小程序开发之路由切换页面重定向问题
Sep 18 Javascript
微信小程序实现上传多张图片、删除图片
Jul 29 Javascript
如何在node环境实现“get数据解析”代码实例
Jul 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函数array_flip()在重复数组元素删除中的作用
2013/06/27 PHP
shell脚本作为保证PHP脚本不挂掉的守护进程实例分享
2013/07/15 PHP
php 下载保存文件保存到本地的两种实现方法
2013/08/12 PHP
php魔术函数__call()用法实例分析
2015/02/13 PHP
Laravel框架中VerifyCsrfToken报错问题的解决
2017/08/30 PHP
web css实现整站样式互相切换
2013/10/29 Javascript
ExtJS如何设置与获取radio控件的选取状态
2014/01/22 Javascript
将form表单中的元素转换成对象的方法适用表单提交
2014/05/02 Javascript
jQuery $.extend()用法总结
2014/06/15 Javascript
jquery预加载图片的方法
2015/05/27 Javascript
Javascript常用小技巧汇总
2015/06/24 Javascript
js从外部获取图片的实现方法
2016/08/05 Javascript
详解JavaScript 中getElementsByName在IE中的注意事项
2017/02/21 Javascript
js禁止浏览器页面后退功能的实例(推荐)
2017/09/01 Javascript
VUE element-ui 写个复用Table组件的示例代码
2017/11/18 Javascript
使用Vue组件实现一个简单弹窗效果
2018/04/23 Javascript
微信小程序实现跑马灯效果完整代码(附效果图)
2018/05/30 Javascript
Vue $emit $refs子父组件间方法的调用实例
2018/09/12 Javascript
Vue中用props给data赋初始值遇到的问题解决
2018/11/27 Javascript
原生js实现随机点名功能
2019/11/05 Javascript
Vue搭建后台系统需要注意的问题
2019/11/08 Javascript
vue tab切换,解决echartst图表宽度只有100px的问题
2020/07/19 Javascript
Javascript异步流程控制之串行执行详解
2020/09/27 Javascript
Python的Twisted框架上手前所必须了解的异步编程思想
2016/05/25 Python
详解python调度框架APScheduler使用
2017/03/28 Python
在Python中使用AOP实现Redis缓存示例
2017/07/11 Python
tensorflow实现残差网络方式(mnist数据集)
2020/05/26 Python
python excel多行合并的方法
2020/12/09 Python
次世代生活态度:Hypebeast
2018/07/05 全球购物
波兰电子产品购物网站:Vobis
2019/05/26 全球购物
军校制空专业毕业生自我鉴定
2013/11/16 职场文书
企业道德讲堂实施方案
2014/03/19 职场文书
毕业生就业推荐表自我鉴定
2014/03/20 职场文书
如何利用JavaScript实现二叉搜索树
2021/04/02 Javascript
python编程项目中线上问题排查与解决
2021/11/01 Python
解析探秘fescar分布式事务实现原理
2022/02/28 Java/Android