IE 11 - 如何防止點擊後複選框被選中？

這是我的HTML：IE 11 - 如何防止點擊後複選框被選中？

<table> 
    <tr> 
     <th>Column 1</th> 
     <th>Column 2</th> 
     <th>Column 3</th> 
    </tr> 
    <tr> 
     <td>R1 C1</td> 
     <td>R1 C2</td> 
     <td><input class="CB" type="checkbox" /></td> 
    </tr> 
    <tr> 
     <td>R2 C1</td> 
     <td>R2 C2</td> 
     <td><input class="CB" type="checkbox" /></td> 
    </tr> 
    <tr> 
     <td>R3 C1</td> 
     <td>R3 C2</td> 
     <td><input class="CB" type="checkbox" /></td> 
    </tr> 
    <tr> 
     <td>R4 C1</td> 
     <td>R4 C2</td> 
     <td><input class="CB" type="checkbox" /></td> 
    </tr> 
    <tr> 
     <td>R5 C1</td> 
     <td>R5 C2</td> 
     <td><input class="CB" type="checkbox" /></td> 
    </tr> 
</table>

這是JavaScript的：

 $(".CB").change(function (e) 
    { 
     if ($(this).is(":checked")) { 
      var returnVal = confirm("Are you sure?"); 
      $(this).attr("checked", returnVal); 
     } 
    } 
    );

JSFiddle

這涉及到IE 11。

正如你可以看到當你點擊未選中的複選框時，它會被選中，然後出現確認對話框。如果你沒有回答「確定」複選框恢復爲未選中狀態。

它將按預期在Chrome，但不是在IE11（FWIW它不工作在FF 52任）

如何，直到確定被壓在確認修改此，這樣當你點擊它選中保持未選中的複選框對話？

另外：使用類名稱「CB」是否可以接受，即使它沒有在任何地方實際定義？它的工作原理據我所知，但由於我不知道的原因，這可能是一種不好的做法。

來源

2017-03-31 Joe Schmoe

我不能複製你描述的行爲。該對話框保持未選中狀態，直到對話框被確認。 – David

儘管一般約定是使用小寫名稱，但可以使用任何您想要的類名稱。更好的辦法是使用像'複選框'而不是'CB'這樣更具描述性的內容，以便其他開發人員更容易查看你的代碼（或者你，當回到它的時候）可以找出你的意圖。 –

對不起，忘了提及 - 這是爲IE 11. OP更新。 –

似乎有一個事件不能被取消或在IE11中被推翻，因爲這個原因，我明確地設置了每次檢查爲false，並根據它的先前狀態和確認響應值進行設置。

$(".CB").on('change', function(e) { 
 
    const checked = this.checked // save the previous state 
 
    this.checked = false // uncheck the box every time 
 
    this.checked = checked && confirm('Are you sure?') // set the new state 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input class="CB" type="checkbox" />

來源

2017-03-31 15:43:29 synthet1c

對不起，我忘了提及 - 我針對的是IE 11，而在IE 11中它不起作用（FF也是一樣）。它在Chrome中工作。我更新了OP。 –

嘗試一下，它在IE11中工作。我不得不在兩個實例中顯式設置屬性，因爲更改事件不能被取消。 – synthet1c

不適用於我。對話框打開並且複選框顯示爲選中狀態。 –

IE 11 - 如何防止點擊後複選框被選中？

回答

相關問題