为内容更改创建jQuery特殊事件

Question

我正在尝试创建一个jQuery特殊事件,当绑定的内容发生更改时触发该事件.我的方法是使用setInterval检查内容,并检查内容是否从上次更改.如果你有更好的方法,请告诉我.另一个问题是我似乎无法清除间隔.无论如何,我需要的是使用event.special检查内容更改的最佳方法.

(function(){

    var interval;

    jQuery.event.special.contentchange = {
        setup: function(data, namespaces) {
            var $this = $(this);
            var $originalContent = $this.text();
            interval = setInterval(function(){
                if($originalContent != $this.text()) {
                    console.log('content changed');
                    $originalContent = $this.text();
                    jQuery.event.special.contentchange.handler();
                }
            },500);
        },
        teardown: function(namespaces){
            clearInterval(interval);
        },
        handler: function(namespaces) {
            jQuery.event.handle.apply(this, arguments)
        }
    };

})();

并绑定它像这样:

$('#container').bind('contentchange', function() {
        console.log('contentchange triggered');
});

我得到console.log'内容已更改',但没有得到console.log'内容更改已触发'.所以很明显,回调永远不会被触发.

我只是使用Firebug来更改内容并触发事件,以测试它.

更新
我认为我不够清楚,我的代码实际上没有用.我正在寻找我做错的事.

这是任何感兴趣的人的完成代码

(function(){

    var interval;

    jQuery.event.special.contentchange = {
        setup: function(){
            var self = this,
            $this = $(this),
            $originalContent = $this.text();
            interval = setInterval(function(){
                if($originalContent != $this.text()) {
                    $originalContent = $this.text();
                    jQuery.event.handle.call(self, {type:'contentchange'});
                }
            },100);
        },
        teardown: function(){
            clearInterval(interval);
        }
    };

})();

感谢Mushex帮助我.

Answer 1

另外看看James 类似的脚本(声明为jquery对象方法而不是事件)

jQuery.fn.watch = function( id, fn ) {

    return this.each(function(){

        var self = this;

        var oldVal = self[id];
        $(self).data(
            'watch_timer',
            setInterval(function(){
                if (self[id] !== oldVal) {
                    fn.call(self, id, oldVal, self[id]);
                    oldVal = self[id];
                }
            }, 100)
        );

    });

    return self;
};

jQuery.fn.unwatch = function( id ) {

    return this.each(function(){
        clearInterval( $(this).data('watch_timer') );
    });

};

并创造特殊事件

jQuery.fn.valuechange = function(fn) {
    return this.bind('valuechange', fn);
};

jQuery.event.special.valuechange = {

    setup: function() {

        jQuery(this).watch('value', function(){
            jQuery.event.handle.call(this, {type:'valuechange'});
        });

    },

    teardown: function() {
        jQuery(this).unwatch('value');
    }

};

无论如何,如果你只需要它作为事件,你的脚本很好:)