Question

我刚刚学会了如何使用方法.on()，并使用它为一些“实时”添加的按钮添加事件处理程序（在DOM准备好之后）。

$('#table').on("click", ".delete", function() {
    //whatever
});

这似乎工作正常，但当我在我的代码中使用它时，我得到两次点击事件。它触发了我更改选择器的次数，也就是说，我单击选择器中的一个名称，然后另一个和另一个名称，让我们说3次，然后当点击提到的按钮时，我将获得一个包含所有这3个名字的警报当时只选择了一个。

我无法在JsFiddle中复制它，因为整个事情都很大。所以，让我知道我还可以添加什么来使问题更好。

JS

 $('#dataSelector').change(function() {
   #more code
    $('#table').on("click", ".delete", function() {
        var data_name = $("#dataSelector option:selected").attr('name');
        alert(data_name);
    });
  });

HTML

<div id="selectData">
    <label>Select:</label>
    <br>
    <div class="">

        <select id="dataSelector" class="form-control">

            <option id="default" selected="true" name="default">Pick</option>

            <option value="1" name="somethingA">somethingA</option>

            <option value="2" name="somethingB">somethingB</option>

            <option value="3" name="somethingC">somethingC</option>

        </select>


    </div>
</div>

<div id="goal_table" class="col-md-12">

    <table id="table" class="table table-bordered">
        <tbody>
            <tr>
                <th>Name1</th>
                <th>Name2</th>
                <th>Name3</th>
                <th>name4</th>
                <th></th>
            </tr>
            <tr id="13">
                <td>somethingA</td>
                <td>value</td>
                <td>whatever</td>
                <td>∞</td>
                <td>
                    <button name="13" type="button" class="btn btn-default delete"><i class="fa fa-trash" aria-hidden="true"></i>
                    </button>
                </td>
            </tr>
        </tbody>
    </table>

</div>

Answer 1

只需在on（）之前添加off（）以删除其上的现有事件

您可能已经绑定了该元素中的事件，因此如果您想重新绑定事件（＆＃39; event＆＃39;）以避免多次触发事件

$('#table').off("click").on("click", ".delete", function() {
    var data_name = $("#dataSelector option:selected").attr('name');
    alert(data_name);
});

Answer 2

我测试了你的代码，对我来说它的工作正常。可能在代码中，您为选择器和删除按钮提供相同的ID。请检查并为每个对象指定唯一的名称。

点击事件多次触发jQuery

2 个答案: