jQuery单击事件不触发相同名称的按钮列表

Question

这两个按钮出现几次，但无法工作：

    <button name='btnEditar' class='btn btn-outline-success me-4' data-bs-toggle='modal' data-bs-target='#staticBackdrop'><i class='bi bi-pencil-square'></i></button>
    <button name='btnEliminar' class='btn btn-outline-danger ms-4' data-bs-toggle='modal' data-bs-target='#staticBackdrop'><i class='bi bi-trash3'></i></button>

这个按钮工作正常(只有一个按钮)：

    <button id="btnAgregar" type="button" class="btn btn-success px-4" data-bs-toggle="modal" data-bs-target="#staticBackdrop">
        Agregar
    </button>

这是JS代码：

jQuery('#btnAgregar').on('click', function () {
    document.getElementById("staticBackdropLabel").innerHTML = "Agregar obra social";
});

jQuery("button[name='btnEditar']").on('click', function () {
    document.getElementById("staticBackdropLabel").innerHTML = "Editar obra social";
});

jQuery("button[name='btnEliminar']").on('click', function () {
    document.getElementById("staticBackdropLabel").innerHTML = "Eliminar obra social";
});

要知道为什么，但是如果我添加这个，代码可以正常工作：

alert(document.getElementsByName("btnEditar"));

这就像警报函数使click事件工作一样。

Answer 1

我解决了它，添加了这样的onclick操作：

<button class='btn btn-outline-success me-4' onclick='modalEdit()' data-bs-toggle='modal' data-bs-target='#staticBackdrop'><i class='bi bi-pencil-square'></i></button>

JS代码：

function modalEdit() {
    $("#staticBackdropLabel").text("Editar obra social");
}