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

Question

问题的简短版本:见标题

问题的长版:我在代码中广泛使用了jquery的show()和hide()函数,只是遇到了一些问题:它们分别通过将元素的display属性更改为'block'或'none'来工作,如果你有一些显示内容:内联然后隐藏并显示它,你已经将它的显示更改为阻止,这在几种情况下搞砸了布局.

在我的代码中,每当我想要隐藏某些东西时,我会给它一个"隐藏"的类.这个类只是{display:none}.我希望更改显示并隐藏以删除或添加此类,而不是直接更改显示属性,这样如果您添加隐藏类然后再次删除它(即隐藏并显示某些内容),那么它又回到了如何它是从一开始就开始的(因为添加一个类会覆盖属性而不是直接更改它们).像这样的东西(这是一个小小的pseucodey,因为我不知道如何正确设置功能 - 让我们假设'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