Question

我很难在自定义jQuery插件中创作（并附加到事件）的方式。

我有一个插件的开头，在这个简单的例子中....

(function($) {
    $.fn.myPlugIn = function(options) {
        var defaults = {
            'width': 200,
            'url': 'www.someurl.com'
        };
        // If options exist, lets merge them with our default settings
        var options = $.extend({}, defaults, options);

        function somePrivateFunction() {
            return options.url;
        }

        return this.each(function() {
            $(this).text(somePrivateFunction());
            $(this).width(options.width);
        });
    };
})(jQuery);

$(document).ready(function() {

    $('#testDiv1').myPlugIn({
        'width': 150
    });
    $('#testDiv2').myPlugIn({
        'url': 'www.google.com'
    });
});

<div id="eventDriver1">Click here to update 1</div>
<div id="eventDriver2">Click here to update 2</div>
<div id="testDiv1" class="testClass"></div>
<div id="testDiv2" class="testClass"></div>

如您所见，我设置了testDiv1和testDiv2，它们的行为与我期望的一样。

现在我希望能够说eventDriver1应该刷新testDiv1，并且它可以指定shoudl进入它的文本。我只是不知道从哪里开始!!

我很欣赏那些已被记录在某处，和/或已经被问过，但我只是不确定我需要搜索哪些流行语！任何帮助赞赏。

感谢。

Answer 1

使用点击。

$('#eventDriver1').click(function(){/*do something*/})

Answer 2

这个怎么样：

<强> Live Demo

$('#eventDriver1').click(function() {
    $('#testDiv1').myPlugIn({'url': 'www.yahoo.com'});
});
$('#eventDriver2').click(function() {
    $('#testDiv2').myPlugIn({'url': 'www.microsoft.com', 'width': 250});
});

jQuery事件绑定

2 个答案: