jQuery toggle() 方法

实例

单击 <p> 元素时在颜色之间切换:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <script src="https://libs.baidu.com/jquery/1.8.1/jquery.min.js">
  5. </script>
  6. <script>
  7. $(document).ready(function(){
  8. $("p").toggle(
  9. function(){$("p").css({"color": "red"});},
  10. function(){$("p").css({"color": "blue"});},
  11. function(){$("p").css({"color": "green"});
  12. });
  13. });
  14. </script>
  15. </head>
  16. <body>
  17. <p style="font-size:40px">点击这里</p>
  18. <div><b>注意:</b> toggle() 方法在 jQuery 1.8 版中被弃用,并在 1.9 版中被删除。我们在本例中使用了 jQuery 的早期版本(脚本标记中的 1.8)</div>
  19. </body>
  20. </html>

定义与用法

toggle() 方法在 jQuery 1.8 版中被 弃用,并在 1.9 版中被 删除

toggle() 方法附加两个或多个函数,以便在选定元素的单击事件之间切换。

当点击一个元素时,第一个指定的函数触发,当再次点击时,第二个函数触发,依此类推。

注意: 还有一个名为 toggle() 的 jQuery 效果方法。根据参数来决定调用哪个函数。

语法

  1. $(selector).toggle(function)
参数描述
function必填。每次单击所选元素时运行的函数

更多实例

演示如何在多个函数之间切换

分类导航