Javascript JQuery:Extend.val()以包含.trigger()

Javascript JQuery:Extend.val()以包含.trigger(),javascript,jquery,Javascript,Jquery,我只是在谷歌上快速搜索了一下如何在JQuery中扩展函数,我不知道我在做什么。我想了解一般情况,但在这个特定的实例中,我想扩展.val()函数,向所有内容添加触发器“更改”事件,因为某些元素(如隐藏输入)在默认情况下不会这样做。换句话说,这是: $('#element').val('newval'); 将自动转换为: $('#element').val('newval').trigger('change'); 这是我的尝试…它正在破坏我的页面,但希望我很接近: (functi

我只是在谷歌上快速搜索了一下如何在JQuery中扩展函数,我不知道我在做什么。我想了解一般情况,但在这个特定的实例中,我想扩展.val()函数,向所有内容添加触发器“更改”事件,因为某些元素(如隐藏输入)在默认情况下不会这样做。换句话说,这是:

$('#element').val('newval');
将自动转换为:

$('#element').val('newval').trigger('change');
这是我的尝试…它正在破坏我的页面,但希望我很接近:

        (function($, input){

            var oldValFn = $.fn.val;

            $.fn.val = function() {
                var ret = oldValFn.apply(this, arguments);
                try {
                                            $(this).val(input);
                    $(this).trigger('change');
                }
                catch(e) 
                {
                    console.log(e);
                }
                return ret;
            }

            $(this).val('newval');

            })(jQuery);

非常感谢您的帮助,因为这显然是我需要从概念上理解的。谢谢

也许这不是最好的解决方案,它也有一些缺点(因为
$.fn.val
已经在内部调用了
this.val
),但是这个实现似乎运行良好,如果值没有更改,就不会触发更改事件,从而避免了无限循环

注意,它还没有被完全测试过,但是如果你认真对待这个插件,你可以编写一些测试用例


无需设置
$(此).val(输入)
。。。。除此之外,您还需要引入一个循环。当您执行
oldValFn.call(this)
时,您只得到第一个元素的值,即使有多个。@user2736012是的,我忘记了这种情况。固定的。
!function ($, oldValFn) {
    $.fn.val = function () {
        var args = arguments;

        if (!args.length) return oldValFn.call(this);

        this.each(function () {
            var $this = $(this),
                oldVal = oldValFn.call($this),
                result = oldValFn.apply($this, args),
                newVal = oldValFn.call($this);

            if (args.length && oldVal !== newVal) {
                $this.trigger('change');
            }
        });

        return this;
    };
}(jQuery, jQuery.fn.val);