后花院 | 静心思考

在工作中碰到了一个问题，情景是：一个按钮，点击出现内容，再点击内容隐藏的一个切换操作。

之前使用toggle方法实现正常，最近提取整合了静态文件后，该功能出现一个问题，就是打开页面时该按钮显示，页面加载完成，该按钮自动消失。后来详细查看后发现出现在toggle这个方法，不同JQuery版本实现方法不同。

在JQuery1.8版本声明了，以下使用方法：

$(selector).toggle(function1(),function2(),functionN(),...)

同时还支持以下两种方式：

$(selector).toggle(speed,callback)

$(selector).toggle(switch)

我们用的就是第一种方法，在toggle里书写了多个方法，第一次点击实现fun1,再点击fun2,然后再循环。

如果你引入的JQuery version < 1.9 ，这种方法没有问题。

但是从v 1.9开始，JQuery更改了toggle的使用方法，如下：

$(selector).toggle(speed,callback,switch)

speed：可选。规定元素从可见到隐藏的速度（或者相反）。默认为 "0"。可能的值：毫秒 （比如 1500）、"slow"、"normal"、"fast"。在设置速度的情况下，元素从可见到隐藏的过程中，会逐渐地改变其高度、宽度、外边距、内边距和透明度。如果设置此参数，则无法使用 switch 参数。

callback：可选。toggle 函数执行完之后，要执行的函数。除非设置了 speed 参数，否则不能设置该参数。

switch： 可选。布尔值。规定 toggle 是否隐藏或显示所有被选元素。True - 显示所有元素；False - 隐藏所有元素。如果设置此参数，则无法使用 speed 和 callback 参数。

注释：该效果适用于通过 jQuery 隐藏的元素，或在 CSS 中声明 display:none 的元素（但不适用于 visibility:hidden 的元素）。