Добавить функцию JQuery к конкретным элементам

Question

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

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

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

Answer 1

Использование .bind() и .trigger()

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


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

По JQuery 1.7, метод .on() является предпочтительным метод для присоединение обработчиков событий к объявлению ocument.

Answer 2

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

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

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

Но поскольку $(...).fn не существует, это не представляется возможным.

Answer 3

лет может сделать выше с этим:

$.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/

Answer 4

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

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

Answer 5

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

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

Answer 6

@ Ответ Рейгеля замечательный! Однако вы можете также использовать синтаксис $.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/

Answer 7

я на самом деле имел этот случай использования, а также, но с кэшированным объектом. Таким образом, у меня уже был объект 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(); 

Answer 8

Я сделал это и его работу отлично ..

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

Answer 9

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

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

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

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

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

без определения его как плагин, или использовать данные или BIND/на/инициирующих событий.

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

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

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

Answer 10

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

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

Затем вызовите его на объект таким образом:

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

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