`
leeqq
  • 浏览: 138139 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

jquery1.7中通过trigger触发checkbox的click事件的一个小坑

    博客分类:
  • web
阅读更多
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript" src="jquery-1.7.2.js"></script>
</head>
<body>
    <input id="checkbox" type="checkbox" />
    <input type="checkbox" id="trigger" />点这个
    <hr>
    <div id="result"></div>
    <script type="text/javascript">
        $('#trigger').on('click', function () {
            $('#checkbox').trigger('click');
        });

        $('#checkbox').on('click', function () {
            $('#result').append($(this).is(':checked') + '<br />');
        });
    </script>
</body>
</html>

 对于上面这段代码,如果直接点id:checkbox,输出的结果和复选框点击之后的状态一致,如果点击trigger通过jquery的trigger触发id:checkbox的click事件,输出的结果和复选框点击之前的状态一致。

 

但是如果将jquery换成1.11.3版本,不管直接点击,还是通过trigger来触发,输出的结果都筛选框点击之后的状态,这也是我想要的结果

 

坑啊,如果想在1.7.2版本和1.11.3版本保持一致,可以将id:checkbox事件的处理过程放在setTimeout里面

 

分享到:
评论

相关推荐

    Jquery为单选框checkbox绑定单击click事件

    这是Jquery中的一个非常重要的方法,它确保了绑定事件的代码只会在DOM完全加载后执行,避免了因文档未完全加载而导致的脚本错误。 在总结上述知识点的同时,我们还应该注意一些常见的开发实践。例如,为了提高代码...

    Jquery1.7最新api

    jQuery 1.7 API 是一个重要的JavaScript库,用于简化HTML文档遍历、事件处理、动画以及Ajax交互。这个API提供了丰富的函数和方法,使得开发者能够更高效地编写跨浏览器的JavaScript代码。以下是对jQuery 1.7 API的...

    关于表格(table)中checkbox等相关事件操作(动态添加行+隔行换色等相关)(jquery)

    本篇将详细探讨如何利用jQuery实现表格中checkbox的相关事件操作,包括动态添加行、隔行换色、选中变色、全选与反选等功能。 首先,让我们了解jQuery的基本概念。jQuery是一个快速、简洁的JavaScript库,它简化了...

    JQuery触发radio或checkbox的change事件

    在JQuery中,当给radio或checkbox添加一个change事件时,如果它的值发生变化就会触发change事件;本文将详细介绍如何利用JQuery触发Checkbox的change事件需要了解的朋友可以参考下

    jQuery操作checkbox并获取选中值

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理、动画效果和Ajax交互。本文将详细讲解如何使用jQuery来操作checkbox,并实现全选、全不选、反选以及获取选中值这四个核心功能...

    JQuery 判断checkbox是否选中,checkbox全选,获取checkbox选中值

    JQuery 判断checkbox是否选中,checkbox全选,获取checkbox选中值

    jquery 的checkbox样式

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了JavaScript代码的编写,使得DOM操作、事件处理和动画效果变得更加便捷。对于“jQuery的checkbox样式”,这是一个关注于提升网页中复选框...

    jQuery的高性能TreeView源码(带CheckBox)

    jQuery的高性能TreeView源码(带CheckBox) 1:支持静态的树,即一次性将全部数据加载到客户端。 2:异步树,即一次只加载一级或若干级节点,子节点可以异步加载数据。 3:Checkbox树(可能是静态树也可能是异步树...

    jquery checkbox 选中 取消 checkbox多选

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理和Ajax交互等任务。本文将深入探讨如何使用jQuery来实现复选框(checkbox)的选中和取消选中功能,以及如何处理多选的情况。 ...

    jquery模拟div多选checkbox下拉框

    通过以上分析,我们可以看出“jquery模拟div多选checkbox下拉框”是一个结合了jQuery、DOM操作、事件处理、CSS定制和数据管理的综合性组件。开发者在使用这个压缩包中的`selectbox`文件时,只需按照提供的API和示例...

    jquery 对checkbox的操作

    在IT领域,jQuery是一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画制作和Ajax交互。本文将详细探讨如何使用jQuery对checkbox进行操作,这些操作包括选择、取消选择、检查状态以及实现更复杂的...

    JQuery操作checkbox、radio等示例

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理、动画效果和Ajax交互。本篇文章将深入探讨如何使用jQuery来操作checkbox和radio元素,这两种元素在表单提交和用户交互中扮演着...

    用JQuery写的图片上加CheckBox

    标题中的“用JQuery写的图片上加CheckBox”指的是在网页中使用JQuery库来实现一个功能,即在图片上方或旁边添加复选框(Checkbox)的功能。这通常用于用户需要选择一组图片时,例如在图库中进行多选操作。JQuery是一...

    jquery input checkbox 联动

    在网页开发中,jQuery 是一个广泛使用的 JavaScript 库,它简化了 DOM 操作、事件处理以及Ajax交互。本文将深入探讨如何在jQuery环境下实现输入框(input)复选框(checkbox)的联动效果,即当某个复选框被选中时,...

    checkbox:click事件触发span元素内容改变的方法

    每当用户点击一个 Checkbox 时,我们就将选择的城市名称添加到数组中,并将数组连接成一个字符串,然后将其显示在 Span 元素中。 这种方法非常实用,可以应用于各种场景,例如在线选课系统、购物网站等等。在实际...

    jquery插件实现下拉多选checkbox的效果

    首先,jQuery UI Multiselect是一个强大的工具,它允许用户在下拉列表中选择一个或多个项目,每个项目对应一个可选的checkbox。这样的设计非常适合于那些需要用户从一系列选项中进行多选的情况,比如设置偏好、筛选...

    jQuery基于layui插件制作checkbox复选框选中代码

    在本文中,我们将深入探讨如何使用jQuery和layui插件来创建功能丰富的checkbox复选框,包括权限范围的多选、单选以及全选操作。同时,我们也将关注于父级和子级复选框之间的联动关系,即父级选中时子级全部选中,而...

    JQuery 自定义 radio与checkbox

    在网页设计中,jQuery 是一个广泛使用的 JavaScript 库,它极大地简化了JavaScript代码的编写,尤其是在处理DOM操作、事件处理和动画效果上。本话题主要关注如何使用jQuery来实现自定义的radio(单选按钮)和...

Global site tag (gtag.js) - Google Analytics