IE 11-如何防止复选框被单击后被选中？

Question

这是我的HTML：

<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中也不起作用）

如何修改此设置，以便当您单击未选中的复选框时，它保持选中状态，直到在确认对话框中按OK为止？

另外：即使实际上没有在任何地方定义，也可以使用类名“ CB”吗？ 据我所知，它可以工作，但是由于我不知道的原因，这可能是一个不好的做法。

Answer 1

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" />