javascript - Javascript event.target.value在firefox中返回的值与Chrome/IE中返回的值不同

我正在使用PHP usign jquery ajax在学校项目中创建一个结帐系统，并且在javascript中从event.target返回的值遇到了一个奇怪的问题。这是HTML和JS。

HTML：

<td>
    <button class='checkout-remove-btn' value='102' onclick='removeProduct(event)'>
        <span class='table-remove glyphicon glyphicon-remove'></span>
    </button>
</td>

JS ：（用于调试的将替换为ajax帖子）

function removeProduct(event) {
    alert(event.target.value + " " + event.target.parentElement.value);
}

问题在于，Firefox和Chrome / IE中的收益不同。

Firefox:
target.value = 102
target.parentElement.value = undefined

Chrome:
target.value = undefined
target.parentElement.value = 102

我不知道为什么对它们的处理方式不同，有没有办法正确获取值102？

最佳答案

jQuery处理事件值的方式是什么？


您可以使用on()或click()附加事件处理程序，然后使用this关键字引用被单击的元素，如下所示：

$('.checkout-remove-btn').click(function() {
    console.log(this.value);
})

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="checkout-remove-btn" value="102">
  <span class="table-remove glyphicon glyphicon-remove"></span>
</button>

以这种方式附加事件消除了关于哪个元素引发事件的歧义，因为this将始终引用选择器中的元素。

关于javascript - Javascript event.target.value在firefox中返回的值与Chrome/IE中返回的值不同，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41897025/