Добавить функцию jQuery для определенных элементов

Я знаю, что вы можете добавить новые функции jQuery $.fn.someFunction = function()

Однако я хочу добавлять функции только к определенным элементам. Я пробовал этот синтаксис, и он не работает $('.someElements').fn.someFunction = function()

Я хочу сделать это, чтобы я мог вызвать такую функцию, как это где-то в коде $('someElements').someFunction();

Ответ 1

Используйте .bind() и .trigger()

$('button').bind('someFunction',function() {
    alert('go away!')
});


$('button').click(function(){
    $(this).trigger('someFunction');
});

Как и в jQuery 1.7, метод . on() является предпочтительным методом для прикрепление обработчиков событий к документу.

Ответ 2

yo может сделать следующее:

$.fn.testFn = function(){
    this.each(function(){
        var className = $(this).attr('class');
        $(this).html(className);
    });    
};

$('li').testFn(); //or any element you want

Тест: http://jsfiddle.net/DarkThrone/nUzJN/

Ответ 3

Йо, нужно было сделать то же самое, придумал это. его хорошая причина, по которой вы уничтожаете элемент, и функция идет пуф! Я думаю...

var snippet=jQuery(".myElement");
snippet.data('destructor', function(){
    //do something
});
snippet.data('destructor')();

Ответ 4

@Reigel ответ велик! Однако вы также можете использовать синтаксис $.fn, и пусть ваша функция обрабатывает только определенные элементы:

$.fn.someFunction = function(){
    this.each(function(){
        // only handle "someElement"
        if (false == $(this).hasClass("someElement")) {
            return; // do nothing
        }

        $(this).append(" some element has been modified");

        return $(this); // support chaining
    });    
};

// now you can call your function like this
$('.someElement').someFunction();

См. рабочий jsfiddle: http://jsfiddle.net/AKnKj/3/

Ответ 5

У меня на самом деле был и этот прецедент, но с кэшированным объектом. Таким образом, у меня уже был объект jQuery, меню, доступное для переключения, и я хотел прикрепить две функции к этому объекту, "открыть" и "закрыть". Функции, необходимые для сохранения области самого элемента, и это было так, поэтому я хотел, чтобы this был объектом меню. В любом случае, вы можете просто добавлять функции и переменные во все стороны, как и любой другой объект javascript. Иногда я забываю об этом.

var $menu = $('#menu');
$menu.open = function(){
   this.css('left', 0);
   this.is_open = true; // you can also set arbitrary values on the object
};
$menu.close = function(){
   this.css('left', '-100%');
   this.is_open = false;
};

$menu.close();

Ответ 6

Если вы хотите эту функцию только для определенных селекторов, для вас будет выполнено следующее. У меня только был сценарий, в котором я нуждался в этом, и он работает хорошо.

$('.my-selector').each(function(){

    $(this).init.prototype.getUrl = function(){
        // do things
    };
})

а затем вы можете сделать

$('.my-selector').getUrl()

без необходимости определять его как плагин или использовать данные или события bind/on/trigger.

Очевидно, вы можете изменить функцию для возврата содержащего объекта, если вы хотите использовать его в цепочке, возвращая this

$('.my-selector').each(function(){

    $(this).init.prototype.getUrl = function(){
        // do things
        return this;
    };
})

Ответ 7

Наиболее очевидным решением является назначение функции как свойства объекта:

obj.prop("myFunc", function() {
  return (function(arg) {
    alert("It works! " + arg);
  });
});

Затем вызовите его на объекте следующим образом:

obj.prop("myFunc")("Cool!");

Примечание: ваша функция является возвращаемым значением внешнего, см. http://api.jquery.com/prop/#prop-propertyName-function

Ответ 8

У меня была идея, что, как я думал, может работать близко к тому, что вы хотите, но это не сработало, и я пришел к выводу, что это невозможно.

Моя идея состояла в том, чтобы сделать то, что вы пробовали, но на кешированном объекте jQuery, например:

var a = $("a");
a.fn.someFunc = function () {...};
a.someFunc();

Но так как $(...).fn не существует, это невозможно.

Ответ 9

Я также не уверен в своем ответе, если это поможет вам, но просто попробуйте как использовать .live?

$(selector).live(click,function(){
    //some codes here
});

Ответ 10

Я сделал это и прекрасно работал.

 function do_write(){
     $("#script").append("<script> $(\'#t"+(id_app+4)+"\').change(function(){  alert('Write Your Code here');    });<\/script>");
     console.log("<script> $(\'#t"+(id_app+4)+"\').change(function(){  alert('hello');    });<\/script>");
}

и функцию вызова из вашей динамической функции, которая создает динамический элемент управления в html