为什么我的 event.target 数据在 chrome 中不起作用？

Question

我有一个功能可以删除表单中在 Firefox 中有效但在 Chrome 中无效的字段。

function activeDelete(del) {
    $('[data-delete="' + del + '"]').click(function(event) {
        deleteField(event);
    });
}

function deleteField(event) {
    if ((members - 1) >= 3) {
        members -= 1;
        var i = $(event.target).data('delete');
        console.log(i)
        var currentdiv = $('[data-div="' + i + '"]');
        currentdiv.remove();
        $("#rollWheel").val("Roll the wheel ! (" + members + " members)");
    } else {
        $('.errors').remove();
        $('#firstCard').append('<div class="errors animated fadeOut">3 participants minimum.</div>');
    }


  }

activeDelete(1);

我记录了我的i变量，它是undefined（在 Chrome 中）。我在本地和我的网站上进行了测试。

我在这里缺少什么？

Answer 1

您应该currentTarget在此处使用代替target，但我建议您使用$(this).

最小变化：

  $(event.currentTarget).data('delete');

建议更改：

function activeDelete(del) {
  $('[data-delete="' + del + '"]').click(function(event) {
    deleteField($(this)); // see here the parameter
    event.preventDefault();
  });
}

function deleteField(obj) {
  if ((members - 1) >= 3) {
    members -= 1;
    var i = obj.data('delete'); // see here the getter
    console.log(i)
    var currentdiv = $('[data-div="' + i + '"]');
    currentdiv.remove();
    $("#rollWheel").val("Roll the wheel ! (" + members + " members)");
  } else {
    $('.errors').remove();
    $('#firstCard').append('<div class="errors animated fadeOut">3 participants minimum.</div>');
  }


}

activeDelete(1);