2009-12-15 7 views
3

У меня есть два события, которые я хочу наблюдать на объекте,Объединение двух обработчиков событий, JQuery

input.blur(function(event) { 
    ajaxSubmit(this); 
    event.preventDefault(); 
}); 

form.submit(function(event) { 
    ajaxSubmit(this); 
    event.preventDefault(); 
}); 

Но я чувствую, что это не достаточно сухой, я могу связать два события моего объекта input и выполните мою функцию ajaxSubmit(), если огонь?


Что бы супер круто, если вы могли бы сделать:

input.bind("blur", "submit", function(event) { 
    ajaxSubmit(this); 
    event.preventDefault(); 
}); 
+1

Вы говорите о «объекте», но ваш образец ссылается на два объекта ('input' и' form'). –

+0

yah ... Я действительно не имел никакого смысла там, да. но что, если они были одним и тем же объектом? и события имели смысл, как «зависание» и «размытие» или что-то еще? существует ли более простой способ привязки нескольких событий? –

ответ

10

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

$("#yourinput").on("blur submit", functionname); 

Можно объединить любое количество событий; отделите их пространством.

+0

Конечно, это не сработает, поскольку поля ввода не имеют событий 'submit', но концепция звучит для привязки нескольких событий. –

+0

Он может связывать любые события внутри функции bind. – rahul

+2

@adamantium, извините, я был неясен. Код не будет вызывать ошибку, но событие 'submit' не будет вызываться в' form' submit, как кажется, намерение OP. –

4

Да, просто объявить функцию, а затем привязать его к событиям:

var ajaxCallback = function(event){ 
    ajaxSubmit(this); 
    event.preventDefault(); 
}; 

input.blur(ajaxCallback); 
form.submit(ajaxCallback); 

Примечание о переменной декларация:

Как @cletus указывает, как я заявляю re функция предоставляет переменную, которая является частной для любой области, в которой она определена. Я всегда программирую этот способ, чтобы минимизировать загрязнение глобального пространства имен. Однако, если вы не определении как этот обратный вызов и связывание его элементов в том же блоке кода, вы должны определить это следующим образом:

function ajaxCallback(event){ ... } 

Таким образом, он доступен везде, где вы позже связать используя методы .blur и .submit.

+0

Вам лучше определить функцию: function ajaxCallback() {...}. Ваш способ может иметь переменную неопределенную, когда вы пытаетесь ее использовать, тогда как прямое определение функции не имеет этой проблемы. – cletus

+0

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

+0

@Doug Neiner: вы связали обработчик * после * выражения функции, поэтому ваш код в порядке. Оба выражения определяют функцию в любой области, в которой находится код. –

Смежные вопросы