Как я должен написать свой плагин для работы с "живыми" элементами?

#javascript #jquery-plugins #jquery-selectors #jquery

#javascript #jquery-плагины #jquery-селекторы #jquery

Вопрос:

я пытаюсь написать свой собственный плагин для самовнушения, используя jquery tutorial, который должен работать с динамически создаваемыми полями. Но у меня нет успеха. Например:

 (function( $ ){

$.fn.dataSuggester = function(options) {

    //By using $.extend we merge predefined options with passed in plugin
    var options = $.extend({location:false, minlength:3, category:false}, options);
    var stop_keys = [16, 17, 18, 19, 20, 33, 34, 35, 36, 37, 38, 39, 40, 44, 45, 46, 91, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123, 144];

    return this.each(function() {

        var o = $(this);
        var suggestWrapper = $('<div class = "data-suggester suggest-box-wrapper">');

        o.focus(function() {
            console.log('aaaaa');
        });

        ...............................

    });

};

})( jQuery );

Когда я пытаюсь использовать его как

 <script type = "text/javascript">
$('.dataSuggest').dataSuggester();
</script>

Он идеально работает для всех элементов, кроме динамически создаваемых : (

Конечно, я могу вызвать свой плагин другим способом, например

 <script type = "text/javascript">
$('.dataSuggest').live('focus', function() {$(this).dataSuggester();});
</script>

но я думаю, что это не так красиво, как я хочу.

Когда я пытаюсь сделать что-то вроде этого:

 o.live('focus', function() {console.log('aaaa');});

Это не работает. Пожалуйста, кто-нибудь мне поможет?

1. Что, черт возьми, это but i think it is not as pretty as i want. значит? Также используйте заглавные буквы i . 🙂

2. «но я думаю, что это не так красиво, как я хочу». — это означает, что я думаю, что это можно решить другим (лучшим) способом, но я не знаю как 🙂 И спасибо вам за ваш комментарий 🙂

Ответ №1:

.live это функция привязки событий. Он работает, беря описание обернутого набора .dataSuggest и привязывая указанное событие всякий раз, когда найден новый элемент, соответствующий этому описанию.

Плагин jQuery работает путем выполнения функции для уже выбранного набора элементов. Это два совершенно разных действия.

Если вы хотите, чтобы ваш плагин использовался .live , то в какой-то момент ему необходимо передать описание целевых элементов (в отличие от обернутого набора самих целевых элементов).

Рассмотрим что-то вроде этого:

 // Plugin in use:
$.dataSuggest({ targetElements: '.customClass' });

// Plugin code:
$.fn.dataSuggester = function(options) {

    $(options.targetElements).live('focus', function(e) {
        // your code here...
    });

};

Обратите внимание, что плагин не используется в обернутом наборе $('.whatever').dataSuggest() , а вместо этого выполняется как простая функция для объекта jQuery.