2011-01-29 3 views
2

У меня есть веб-сайт, который динамически создает различные входы.Связать события jQuery только с определенными кнопками

У меня есть 3 конкретных входа, которые я бы назвал функцией JQuery при нажатии.

<input type="button" name="Finish" value="Finish"> 
<input type="button" name="Update" value="Update"> 
<input type="button" name="Cancel" value="Cancel"> 

использовал этот код:

jQuery(":button").click(function(){ 
    //Do summat 
}): 

, но это делает все входы на странице вызова функции, когда я только хочу, 3 входа выше для вызова функции. Это возможно?

uggers

ответ

7

Дайте им имя класса и использовать это в селекторе. Например. class="clickyButton" и $('.clickyButton').click(function() { /* your code *) });


На боковой ноте, нет необходимости писать jQuery вместо $. Если вы не хотите $ в глобальном пространстве имен по какой-то причине (и, таким образом, называется $.noConflict();), вы можете обернуть свой код в функции, содержащей $ отображенной на JQuery:

(function($) { 
    /* your code using $ here */ 
})(jQuery); 
0

Вы должны быть более «селективный «:

<input class="buttongroup" type="button" name="Finish" value="Finish"> 
<input class="buttongroup" type="button" name="Update" value="Update"> 
<input class="buttongroup" type="button" name="Cancel" value="Cancel"> 

Тогда:

jQuery("input.buttongroup").click (function(){ 
    //Do stuff 
}): 
+0

jQuery(), а не jquery() - и вместо кнопки [type = button] с помощью jQuery's: селектор будет лучше (но вам это совсем не нужно - простая «.buttongroup» достаточно) – ThiefMaster

+0

@ThiefMaster: Спасибо, я этого не заметил. –

+0

Большое спасибо за ваши ответы. Теперь отсортировано !!! – Uggers2K

4

Используйте родительский элемент размаху ваши кнопки правильно

HTML

<div id="my-group"> 
    <input type="button" name="Finish" value="Finish"> 
    <input type="button" name="Update" value="Update"> 
    <input type="button" name="Cancel" value="Cancel"> 
</div> 

<div id="not-my-group"> 
    <input type="button" name="Finish" value="Finish"> 
    <input type="button" name="Update" value="Update"> 
    <input type="button" name="Cancel" value="Cancel"> 
</div> 

JS

$("#my-group :button").click(function(){ 
    alert('foobar'); 
}); 

http://jsfiddle.net/wpELC/2/

Использование родительского селектора #my-group позволит Вам предназначаться только определенные группы кнопок.

0

Если имя атрибуты вы уникальны, вы можете просто использовать те:

$("input").filter(function() { 
    return this.name.match(/Finish|Update|Cancel/); 
}).click(function() { 
    // example of doing something 
    alert($(this).val()); 
}); 

Если они не являются уникальными, вы должны добавить что-то уникальное для них как класс или идентификатор, как показано в другие ответы

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