jQuery的toggle()方法应该是在鼠标点击后才会触发，现在的问题是在ready加载后就自动触发了，怎么回事呢？

答案是jQuery的版本问题，在1.9以后的版本toggle()就存在这个问题，用之前的版本就正常了。​

如果你非常喜欢这个功能，有2个办法，一个办法是jquery官网提供的一个版本升级文件。http://blog.jquery.com/2013/05/08/jquery-migrate-1-2-1-released/

另外一个办法是笨办法，就是把原来的那块代码拿出来，写成一个插件。

<!doctype html>

<html>

<head>

    <meta charset="UTF-8">

    <title>test</title>

    <script type="text/javascript" src="http://cdn.staticfile.org/jquery/1.11.1/jquery.js"></script>

</head>

<body>

<button>test click me</button>

<script>

    $(document).ready(function(){

        $("button").toggle(function(){

            $("body").css("background-color", "green");

        }, function(){

            $("body").css("background-color", "red");

        }, function(){

            $("body").css("background-color", "yellow");

        });

    });

    $.fn.toggle = function( fn ) {

        // Save reference to arguments for access in closure

        var args = arguments,

                guid = fn.guid || jQuery.guid++,

                i = 0,

                toggler = function( event ) {

                    // Figure out which function to execute

                    var lastToggle = ( jQuery._data( this, "lastToggle" + fn.guid ) || 0 ) % i;

                    jQuery._data( this, "lastToggle" + fn.guid, lastToggle + 1 );

                    // Make sure that clicks stop

                    event.preventDefault();

                    // and execute the function

                    return args[ lastToggle ].apply( this, arguments ) || false;

                };

        // link all the functions, so any of them can unbind this click handler

        toggler.guid = guid;

        while ( i < args.length ) {

            args[ i++ ].guid = guid;

        }

        return this.click( toggler );

    }

</script>

</body>

</html>

jQuery的toggle()的自动触发真烦人的更多相关文章

  1. 解决jQuery的toggle()的自动触发问题

    在1.9以后的版本toggle()就存在这个问题,用之前的版本就正常了 解决办法: 1.去 jquery官网下载一个版本升级文件.http://blog.jquery.com/2013/05/08/j ...

  2. 使用jQuery中trigger()方法自动触发事件

    一.常用事件 在页面加载完成时  自动触发input的点击事件,在移动端可以实现自动弹出输入法,获得焦点 $("input").trigger("click") ...

  3. jQuery 学习笔记（5）（事件绑定与解绑、事件冒泡与事件默认行为、事件的自动触发、自定义事件、事件命名空间、事件委托、移入移出事件）

    1.事件绑定: .eventName(fn) //编码效率略高,但部分事件jQuery没有实现 .on(eventName, fn) //编码效率略低,所有事件均可以添加 注意点:可以同时添加多个相同 ...

  4. jquery自动触发click事件

    $("").trigger("click"); //jquery的自动触发事件

  5. 原生js自动触发事件

    熟悉jquery的童鞋都知道在jq中有一个方法可以自动触发事件,那就是trigger(),那么通过原生js又怎么模拟触发呢? js中添加一个主动触发事件的方法有dispatch.该方法能模拟用户行为, ...

  6. jQuery实现用户输入自动完成功能

    jQuery实现用户输入自动完成功能 利用jQuery UI中Auto-complete插件实现输入自动完成功能,大家在使用诸如淘宝.京东等电商平台搜索商品时,往往只要输入商品的一些特殊字符,就可以显 ...

  7. jQuery的事件绑定与触发 - 学习笔记

    jQuery的事件绑定与触发 事件绑定 自动触发事件 常用的鼠标事件 事件冒泡和默认行为 事件冒泡 默认行为 获得当前鼠标的位置和按键 jQuery的事件绑定与触发 事件绑定 基本绑定 $(eleme ...

  8. TeamCity : 自动触发 Build

    创建了 build 的配置以后,您既可以手动点击 "Run" 按钮来触发一次 build 过程,也可以通过 Triggers 配置实现自动触发 build 过程.一个 trigge ...

  9. ionic下拉加载自动触发

    ionic提供的下拉加载,是要滑动去下拉加载,没有提供api自动触发下拉加载,比如刚进页面,或者切换tab时想触发一次下拉加载. 添加如下service: angular.module('YourAp ...

随机推荐

  1. Can't find keyplane iOS模拟器键盘不显示解决办法

    静下心来学技术,新一波的问题再度来袭 学习swift的时候做一个app,需要用到数字键盘,但是在调试了几次后数字键盘便出不来了,控制台中弹出这样一个错误 Can't find keyplane tha ...

  2. spring security源码分析之core包

    Spring Security是一个能够为基于Spring的企业应用系统提供声明式的安全访问控制解决方案的安全框架.它提供了一组可以在Spring应用上下文中配置的Bean,充分利用了Spring I ...

  3. L - Abbott's Revenge（比较复杂的bfs）

    Time Limit:3000MS     Memory Limit:0KB     64bit IO Format:%lld & %llu Submit Status Practice UV ...

  4. Triangular Sums

    描述 The nth Triangular number, T(n) = 1 + … + n, is the sum of the first n integers. It is the number ...

  5. iOS 生成随机数 重复 不重复

    //编程的时候,有三条任选执行路径,都会显示一些图片,比如路径1显示的图片是一个人,路径2显示的是两个人,路径3显示任意人数的图片,要求每次进入该页面都不能重复初始的那张图片. 于是我想到了 运用随机 ...

  6. Android 高级UI设计笔记13：Gallery（画廊控件）之 循环显示图像

    1. 循环显示图像的原理  循环显示有些类似于循环链表,最后一个结点的下一个结点又是第1个结点.循环显示图像也可以模拟这一点. 也许细心的读者从上一节实现的ImageAdapter类中会发现些什么.对 ...

  7. 【阿里云产品公测】弹性伸缩服务ESS之试用初体验

    弹性伸缩服务ESS之试用初体验 作者:云郎 2014/10/15 阿里云弹性伸缩服务(Elastic Scaling Service)是根据用户的业务需求和策略,自动调整其弹性计算服务器(ECS)的管 ...

  8. NS_ENUM和NS_OPTIONS区别

    首先,NS_ENUM和NS_OPTIONS都是宏. Foundation框架中定义了一些辅助的宏,用这些宏来定义枚举类型时,也可以指定用于保存枚举值的底层数据类型.这些宏具有向后兼容能力,如果目标平台 ...

  9. POI导出EXCEL经典实现

    1.Apache POI简介 Apache POI是Apache软件基金会的开放源码函式库,POI提供API给Java程式对Microsoft Office格式档案读和写的功能. .NET的开发人员则 ...

  10. ReactNative学习－ListView

    ListView相对于View的优点就在于可以不用一下子就把数据加载完,而是滑动着加载着数据,可以缓解数据加载,避免软件卡死. 官方文档:https://facebook.github.io/reac ...