开发者

jQuery.live() on plugin selector elements

Alright, my issue is, I have created a jQuery plugin that binds a click, and mouseover event to the elements provided by the selector. Now, I need those events, to instead, be ".live" events, after a lot-a-bit of searching, I found 'a' solution located here

Which, the given solution is as follows..

开发者_如何学编程
(function($) {
  $.fn.liveBindTest = function() {
    return this.each(function() {
      $(this).click(function(){
        console.log('click');
        return false;
      });
    });
  };
})(jQuery);

$('a').live('click', function(){ $(this).liveBindTest(); });

Though, this doesn't make sense, as then the plugin wouldn't be binding the live click to the 'selectors' provided. On the other hand it 'would' bind a click event to the selector elements. (In this case, the anchor tags, and not specifically a dynamically provided by developer selector set)

The above example is simply taking a long route to bind a live click to all anchor elements. Which, works in the case that you need a specific element live binded for your plugin. But my plugin is based solely on the selectors provided by the end developer using the plugin. So this solution means each time the developer would either,

A. Need to manually bind each live event the PLUGIN needs, before they actually init the plugin. Sort of like this..

$('*:not(.complicatedSelectorHere)').live('click', function(){
    $(this).liveBindTest();
});

or

B. They would need to go into the jQuery.plugin.js file, go to the bottom of the code, and modify the live events there. This would be an ugly way of doing things, and not vary portable at all, which is what is needed as well, portability.

So my end question, to make sure it is clear with everyone..

Question: How does one bind a LIVE event to ALL SELECTORS provided to a plugin?

Please do no provide the obvious solution below, as it does not work...

(function($) {
  $.fn.liveBindTest = function() {
    return this.each(function() {
      $(this).live('click', function(){
        console.log('live clicked');
        return false;
      });
    });
  };
})(jQuery);


Every jQuery object has a selector property, so just use that:

$.fn.liveBindTest = function () {
    $(this.selector).live('click', function () {
        console.log('live clicked');
        return false;
    });
});

Of course, in order for this to work, a selector of some sort has to be used, i.e:

// This will work
$('body').liveBindTest();

// This WON'T work
$(document.body).liveBindTest();
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜