即使運行了 preventDefault ，也會在單擊事件上檢查單選按鈕

Question

 thing.addEventListener('click', click) function click(e) { e.preventDefault() console.log(e.target.checked); }

 <input id="thing" type="radio" name="gender">

即使運行了 preventDefault 並且未選中單選按鈕，為什么e.target.checked == true ？

Answer 1

當您調用 preventDefault 時，單選按鈕已被選中。 preventDefault 只是撤消此操作。 如果您在控制台日志上設置一個短超時，您可以看到這一點。

 thing.addEventListener('click', click) function click(e) { e.preventDefault(); setTimeout(function(){ console.log(e.target.checked); }, 10); }

 <input id="thing" type="radio" name="gender">

Answer 2

因為preventDefault()從觸發事件函數的標記中刪除了值。 但是當after preventDefault()被觸發后， e.target.checked是false ，如下所示。 所以最后 e.target.checked 是假的。

 thing.addEventListener('click', click) function click(e) { e.preventDefault() console.log(e.target.checked); setTimeout(()=> console.log(e.target.checked), 100); }

 <input id="thing" type="radio" name="gender">