通過點擊標籤檢查複選框時確認javascript

Question

我在表單上有一個複選框，可以做一些危險的事情。所以，我想確保用戶確定何時檢查這個項目，但我不想警告他們，如果他們沒有選中複選框。

我的問題是這個工作正常，如果他們點擊實際複選框取消選中它，但不是標籤的文本。

http://jsfiddle.net/j2ppzpdk/

function askApply() { 
 
    if (document.getElementById("apply").checked) { 
 
    var answer = confirm("Are you sure about that?"); 
 
    if (!answer) { 
 
     document.getElementById("apply").checked = false; 
 
    } 
 
    } 
 
}

<form> 
 
    <label onclick="askApply();"> 
 
    <input type="checkbox" name="apply" id="apply" value="1" />&nbsp; Apply 
 
    </label> 
 
</form>

Answer 1

一些注意事項：

• 更好的事件監聽器添加到改變元素（複選框），而不是它的標籤。
• 最好聽change事件而不是click。例如，可以使用鍵盤更改複選框。
• 更好地避免內聯事件偵聽器。您可以改用addEventListener。

document.getElementById('apply').addEventListener('change', function() { 
 
    if(this.checked) { 
 
    var answer = confirm("Are you sure about that?"); 
 
    if (!answer) { 
 
     document.getElementById("apply").checked = false; 
 
    } 
 
    } 
 
});

<form> 
 
    <label> 
 
    <input type="checkbox" name="apply" id="apply" value="1" /> 
 
    &nbsp; Apply 
 
    </label> 
 
</form>