绑定到窗口小部件外部的jQuery UI窗口小部件的“create”事件

时间:2014-02-05 10:51:45

标签: jquery jquery-ui jquery-ui-widget-factory

我遇到了与使用jQuery UI Widget Factory的小部件的'create'事件绑定的麻烦。只有当我在小部件外绑定它时才会发生这种情况。请参阅代码段(为测试目的而简化)

(function($){

    $.widget('pr.test', {
        options: {
            create: function(e){
                // Shows up in the console
                console.log('Widget created');
            }
        }
    });

})(jQuery);

然后在其他文件中我绑定到此事件

jQuery(document).ready(function($){

    $('body').test().on('testcreate', function(){
        // Doesn't show up in the console
        console.log('Widget created');
    });

});

我知道我可以这样做

$('body').test({
    create: function(){
        console.log('Widget created')
    }
});

但是我需要能够在小部件初始化之后多次绑定到事件。 有人可以解释一下问题是什么吗?感谢。

1 个答案:

答案 0 :(得分:0)

回答我自己的问题,以防有人遇到同样的问题。我的错误是在窗口小部件初始化之后调用.on()方法,而我之前应该调用它。根据我的理解,脚本不知道任何事件处理程序在被触发时绑定到'create'事件。

请参阅this fiddle

$.widget('pr.test', {
    options: {
        create: function(){
            console.log('Called from within the widget');
        }
    }
});

// Binding to the event before it is fired
$('body').on('testcreate', function(){
    console.log('Called from outside the widget');
});

$('body').test();

// Binding to the event after it is fired
$('body').on('testcreate', function(){
    console.log('This will not work');
});