如何重置受jquery函数影响的元素

Question

我有一个jQuery函数，当单击一个框时会运行该函数，影响页面上的多个其他元素（从一组div创建一个幻灯片）。页面上有多个框，只要再次单击该框，我需要将受该功能影响的元素重置为正常。是否有一种更简单的方法来重置受jQuery影响的元素，或者基本上向后运行函数而不是编写另一个撤消第一个函数所做的功能的函数？

这是一个jsfiddle。

Answer 1

没有简单方式向后运行，因为你需要知道如何应用相反的效果。假设您应用了一些颜色，首先需要保存当前颜色才能还原它。

最好的方法是编写一个撤消第一个函数所做的功能。此外，您可以自定义“撤消”功能（假设您希望在缩小图像时执行不同的动画）。

Answer 2

执行所描述的一种简单方法是使用CSS类来封装要使用JQuery应用的所有更改。您的第一个功能使用addClass来应用更改，然后您可以使用removeClass还原更改。

Answer 3

不，除了编写满足您需要的自定义函数之外，没有其它方法。

这是关于此问题的jQuery论坛上的discussion。

Answer 4

只是关于你的jsfiddle的补充评论 - 在你的点击监听器中你应该避免使用一遍又一遍地创建这么多的jquery对象：

$(this)

相反，只需在函数顶部定义一次：

var $this = $(this);

这将有助于提高绩效，是最佳实践。