JQuery - 如何修改特定元素的 jquery 方法

Question

我要做的是更改特定元素的默认jquery方法。

例如，我想更改一些（不是全部）select 列表的方法val()。然后在必要时恢复。

我的第一次尝试是以下但不工作。

$('#list').val = function(){ alert('toto'); };
//and then
$('#list').val()  //not work

解决方案

var old_val = $.fn.val;
$.fn.val = function(value){
    //some condition to trigger
    if (this.hasClass('someclass')){
        //getter
        if (value===undefined){
            //do something to get the values
            return val;
        }
        //setter
        else {
            //do something with the value
            return this;
        }
    }

    return old_val.apply(this, arguments);
};

Answer 1

每次调用 $('#list') 时，您都在创建一个新的 jQuery 对象。因此，当您执行$('#list').val = function(){ alert('toto'); }; 时，您已经为仅该实例 覆盖了val() 方法。如果你缓存了那个对象，你可以继续使用被覆盖的 val() 方法：

var list = $('#list');
list.val = function(){ alert('toto'); };
list.val(); //alerts 'toto'

但是，这是一种不好的做法，因为您不知道还有什么取决于 val() 正常工作。更好的方法是创建自己的插件：

$.fn.totoVal = function() {
    alert('toto');
    return this;
};

然后您可以将其称为$('#list').totoVal()

编辑

如果您真的非常想这样做（这也是一个坏主意），您可以通过这种方式覆盖本机 val() 实现：

var originalValueFunct = $.fn.val;

//update value function
$.fn.val = function () {
    return "custom value";
}

//do something with val()

//restore value function
$.fn.val = originalValueFunct;

有关覆盖和恢复本机 val() 函数的示例，请参阅此 working demo。

我强烈建议不要这样做，因为您将在您的代码或您使用的任何依赖 val() 方法的库中创建副作用。这些副作用将很难调试，因为它们只会出现在您的环境中，而且您更改了部分核心 jQuery 功能并不总是很明显。

Answer 2

jquery 提供了 valHooks 对象，您可以将任何想要附加到 .val() 函数的函数附加到该对象。 你的例子看起来像这样，放在一行中。

$.valHooks.select = {get: function(elem) { if($(elem).attr('id') == 'list') alert('toto') }}

有关 valHooks 的更多详细信息，您可以查看 jquery api 文档http://api.jquery.com/val/