Question

我有一个动态创建各种输入的网站。

我有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

Answer 1

给他们一个类名，并在选择器中使用它。例如。 class="clickyButton"和$('.clickyButton').click(function() { /* your code *) });

另一方面，没有必要写jQuery而不是$。如果由于某种原因你不想在全局命名空间中使用$（因此称为$.noConflict();），你仍然可以将你的代码包装在一个包含映射到jQuery的$的函数中：

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

Answer 2

使用父元素正确调整按钮的范围

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将只允许您定位特定的按钮组。

Answer 3

使用类来确定您要采取的措施。

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

然后使用以下内容：

$('.Finish').click(function() { /* Finish code */ });
$('.Update').click(function() { /* Update code */ });
$('.Cancel').click(function() { /* Cancel code */ });

Answer 4

你需要更具“选择性”：

<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
}):

Answer 5

如果您拥有的名称属性是唯一的，您可以使用：

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

如果它们不是唯一的，您将不得不像类或ID那样添加一些独特的东西，如其他答案所示

仅将jQuery click事件绑定到某些按钮

5 个答案: