Javascript 一组按钮上的JQuery单击事件

我使用以下JQuery代码捕获单个按钮上的点击：

$(function () {

    //Set up click event on the Remove button
    $('#ButtonRemove').click(function (event) {
    //Process button click event
    }
}

HTML本身的位置如下：

<input type="submit" name="ButtonRemove" value="Remove Now" id="ButtonRemove" />

那么，我可以调整JQuery语句以在一个方法中捕获所有这些按钮吗

---

编辑：哇。谢谢大家！有很多方法可以做到这一点。JQuery非常方便

为每个按钮指定相同的类或使用类型“submmit”

<input type="submit" name="ButtonRemove_01" class='classname' value="Remove Now" id="ButtonRemove_01" />
<input type="submit" name="ButtonRemove_02" class='classname' value="Remove Now" id="ButtonRemove_02" />
...

JS使用类型

$("input:submit").click(function(){

  ///your code
});

---

对按钮使用classname，以便jquery selctor选择事件并将其应用于所有与classname匹配的事件

Js Html 或

---

有几种方法。如果要捕获所有提交按钮的事件

$(":submit").on("click", function() {
 // Carry on
});

但似乎您正在尝试选择以

按钮nRemove

开头的元素。所以

$("[name^='ButtonRemove']").on("click", function() {
    // This function will apply on the elements whose name start with "ButtonRemove"
});

当然！与委派一起使用：

html:

---

您还可以使用更具体的选择器，例如

“input[id^='ButtonRemove\']”

将针对id以ButtonRemove\

开头的所有按钮。但是我怎么知道被点击的按钮的ID或名称呢？@ahmd0使用$（这个）。我已经包括了一个文档链接。@SpYk3HH你在说什么？？？例如，this.id将为您提供按钮id。您的包装注释也没有意义…@Christophe很简单，您不能调用按钮id并获取内部按钮。在委托形式中，on的工作方式与此不同。它的工作原理是

$（父项）。在（“事件”、“子项”和func

。如果要按照您的建议动态使用它，则按钮需要一个包装器。请参阅@Christophe我看到您更改了答案，这更有意义！：）在页面加载后由Javascript动态生成，还是在创建页面时由服务器脚本动态生成？@Barmar:按钮是由ASP.NET脚本在服务器上生成的。然后使用“类”answers.re“jQuery非常方便”：您要求使用jQuery，但普通JavaScript和其他一些库就可以了。不，不是所有提交按钮都可以。如果你这样说，我只需要那些名称或ID以

按钮nRemove\uu

开头的。

$(function () {

    //Set up click event on the Remove button
    $('.btnRemove').click(function (event) {
    //Process button click event
    alert(this.id);
    }
});

<input type="submit" class="btnRemove" name="ButtonRemove_01" value="Remove Now" id="ButtonRemove_01" />
<input type="submit" class="btnRemove" name="ButtonRemove_02" value="Remove Now" id="ButtonRemove_02" />

    //Set up click event on the Remove button
    $(document).on('click', '.btnRemove' ,function (event) {
    //Process button click event
       alert(this.id);
    });

$(function () {
$('contanerSelector').on('click', '.btnRemove' ,function (event) {
        //Process button click event
          alert(this.id);
        });
});
  

$(":submit").on("click", function() {
 // Carry on
});

$("[name^='ButtonRemove']").on("click", function() {
    // This function will apply on the elements whose name start with "ButtonRemove"
});

<div id="Buttons">
<input type="submit" name="ButtonRemove_01" value="Remove Now" id="ButtonRemove_01" />
<input type="submit" name="ButtonRemove_02" value="Remove Now" id="ButtonRemove_02" />
</div>

$("#Buttons").on("click","input",function(event){
  $(this)...
});