jquery - 如何重写 jquery 的 show() 和 hide() 函数

Question

问题的简短版本:参见标题

问题的长版本:我在代码中广泛使用了 jquery 的 show() 和 hide() 函数，但遇到了一些问题:它们的工作原理是分别将元素的显示属性更改为“block”或“none”，因此，如果您如果有一些具有 display: inline 的东西，然后隐藏并显示它，您已将其显示更改为 block ，这在几种情况下会搞乱布局。

在我的代码中，每当我最初想要隐藏某些内容时，我都会给它一个“隐藏”类。这个类就是 {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