JQuery中的toggle()方法,相当于点一个元素时,重复循环两个函数,而这两个函数可以作为toggle()函数的两个参数传进去,当第一次点击的时候会执行前面的参数,而第二次点击时执行的是后面的参数,第三次点击时又会重新执行第一个参数...这样循环执行两个函数。

在开发时,利用toggle()函数可以实现控制一个元素的隐藏和显示。比如一个元素初始时为显示状态,当鼠标第一次点击时,把该元素隐藏,当鼠标再次点击时,控制这个元素显示,十分方便。

代码:

$("#btn").toggle(function(){
//控制box隐藏
$("#box").hide();
},function(){
//控制box显示
$("#box").show();
});

JQuery 的toggle() 方法如何使用?的更多相关文章

  1. jQuery 效果 - toggle() 方法切换元素的可见状态。

    定义和用法 toggle() 方法切换元素的可见状态. 如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素. 语法 $(selector).toggle(speed,callback, ...

  2. jQuery使用toggle()方法进行显示隐藏

    转自:https://www.cnblogs.com/sosoft/p/3460556.html 这是一个示例: 1 <html> 2 <head> 3 <script ...

  3. 使用jQuery的toggle()方法对HTML标签进行显示、隐藏操作

    这是一个示例: <html> <head> <script type="text/javascript" src="https://code ...

  4. jquery 复合事件 toggle()方法的使用

    定义和用法 toggle() 方法用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件. 语法: $(selector).toggle(function1(),function2 ...

  5. jQuery事件 - toggle() 方法

    1.切换元素的显示与隐藏状态 实例 切换 <p> 元素的显示与隐藏状态: $(".btn1").click(function(){ $("p").h ...

  6. 很实用的jQuery事件 - toggle() 方法

    实例 切换不同的背景色: $("p").toggle( function(){ $("body").css("background-color&quo ...

  7. 用jQuery的toggle方法实现元素的左右滑动隐藏

    通常情况下给元素加toggle方法通常会是上下滑动隐藏,而有时我们又需要左右滑动隐藏怎么办呢 $(document).ready(function(){ $('#example').click(fun ...

  8. Jquery的toggle()方法

    toggle()并不是仅仅能 显示/隐藏而已 它的格式如下 toggle(fn1,fn2,fn3.....) 也就是说,它的参数可以说不定数目的 若干个方法,然后每个方法按顺序轮番调用 $(docum ...

  9. 仿jQuery的toggle方法

    两次点击事件进行切换 var toggle = (function () { var a = true; return function (fn1, fn2) { a = !a; var toggle ...

随机推荐

  1. IIS网站无法启动,提示 另一个程序正在使用此文件

    s还用netstat -ano命令,观察哪一个进程正在使用80端口,任务管理中勾选PID,看看是哪个程序,关掉即可

  2. 爬虫定时任务 redis 减轻 mysql 读的压力 加层

    非工作时间,定时任务爬虫大量mysq短链接,影响了其他业务的,mysql 报 too many connections  错误 将爬虫url池放入到redis中,单独的脚本维护redis url池的更 ...

  3. go14--并发concurrency,Goroutine ,channel

    package main /** 并发concurrency 很多人都是冲着 Go 大肆宣扬的高并发而忍不住跃跃欲试,但其实从 源码的解析来看,goroutine 只是由官方实现的超级“线程池”而已. ...

  4. Unicode and .NET

    http://csharpindepth.com/Articles/General/Unicode.aspx Scope of this page This is a big topic. Don't ...

  5. YTU 2626: B 统计程序设计基础课程学生的平均成绩

    2626: B 统计程序设计基础课程学生的平均成绩 时间限制: 1 Sec  内存限制: 128 MB 提交: 427  解决: 143 题目描述 程序设计基础课程的学生成绩出来了,老师需要统计出学生 ...

  6. Bing必应地图中国API-显示兴趣点 (转)

    Bing必应地图中国API-显示兴趣点 2011-05-24 14:29:55|  分类: Bing&Google|字号 订阅     在地图上显示一个兴趣点,这个应用可以说是最简单但是最广泛 ...

  7. 【HDU 2157】 How Many Ways??

    [题目链接] 点击打开链接 [算法] 设A[i][j]为走一条边,从i走到j的方案数 C[i][j]为走两条边,从i走到j的方案数,显然有 : C = A * A = A^2 C'[i][j]为走三条 ...

  8. 佛祖保佑 永无bug 代码注释

    // // _oo0oo_ // o8888888o // 88" . "88 // (| -_- |) // 0\ = /0 // ___/`---'\___ // .' \\| ...

  9. C# 简单实现直线方程,抛物线方程(转载)

    http://www.cnblogs.com/hsiang/archive/2017/01/17/6294864.html 本例子是简单的在WinForm程序中实现在坐标系中绘制直线方程,抛物线方程, ...

  10. HTML <input>标签属性