如何覆盖 jquery 的 show() 和 hide() 函数

Question

问题的简短版本：见标题

问题的长版： 我在我的代码中广泛使用了 jquery 的 show() 和 hide() 函数，只是遇到了一点问题：它们通过将元素的显示属性分别更改为“块”或“无”来工作，所以如果你有一些有显示的东西：内联然后隐藏并显示它，你已经将它的显示更改为块，这在一些情况下会搞砸布局。

在我的代码中，每当我最初想要隐藏某些东西时，我都会给它一个“隐藏”类。这个类只是 {display: none}。我希望更改显示和隐藏以删除或添加此类，而不是直接更改显示属性，这样如果您添加隐藏类然后再次将其删除（即隐藏和显示某些内容），那么它又回到了原来的样子它是从开始的（因为添加一个类会覆盖属性而不是直接更改它们）。像这样的东西（这有点伪代码，因为我不知道如何正确设置函数 - 让我们假设“this”是调用显示/隐藏的对象）

function show(){
  this.removeClass("hidden");
} 

function hide(){
  this.addClass("hidden");
} 

我将如何以及在哪里重写 jquery 方法？ （我不是 javascript 专家）

谢谢 - 最大

Answer 1

当您可以创建自己的方法时，我不会覆盖 jQuery 的方法。覆盖很可能会导致插件出现意外行为。

jQuery 已经有一个名为 toggleClass() 的方法，它似乎符合您的要求。

$someElement.toggleClass('hidden');

文档：http://api.jquery.com/toggleClass/

---

编辑：

但要回答您的具体问题，要覆盖 jQuery 方法，您可以执行以下操作：

jQuery.fn.show = function() {
    // Your custom code
}

或者创建自定义方法：

jQuery.fn.customMethod = function() {
    // Your custom code
}

在这样做之前，最好先查阅此文档：

http://docs.jquery.com/Plugins/Authoring