禁用复选框在Internet Explorer中不起作用但在chrome中有效

时间:2017-08-30 16:37:11

标签: javascript jquery

我想在少数用户的数据表中禁用复选框,当我通过IE打开我的链接时,这些用户可以更改复选框,而我在Chrome中看不到任何问题,它按预期工作。用户无法检查这些框。

以下是代码

if(getURLParam("filetype"))
    {
        $(".disablePage").addClass('disabledbutton');
        $("#picklistBody").addClass('disabledbutton');
        $("#STATUSDIVID").removeAttr('class').addClass('div-warning').html("This page is view only!");  
    }   

您能否告诉我如何限制用户在IE中打开链接时检查框。

2 个答案:

答案 0 :(得分:2)

如果您只是想禁用用户无法选中复选框,请使用attr或prop根据Jquery版本禁用它们:

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<table>
  <tr>
    <td style="height:66px;">
      <button class="head-button-size blue-bg" ui-sref="start">
            <div style="text-align:center">
              <md-icon class="material-icons head-material">domain</md-icon>
              <br>
              <span class="head-mini-text">PROPERTY</span>
            </div>
          </button>
    </td>
    <td style="height:66px;">
      <button class="head-button-size blue-bg" ui-sref="start">
            <div style="text-align:center">
              <md-icon class="material-icons head-material">domain</md-icon>
              <br>
              <span class="head-mini-text">PROPERTY</span>
            </div>
          </button>
    </td>
    <td style="height:66px;">
      <button class="head-button-size blue-bg" ui-sref="start">
            <div style="text-align:center">
              <md-icon class="material-icons head-material">domain</md-icon>
              <br>
              <span class="head-mini-text">PROPERTY</span>
            </div>
          </button>
    </td>
  </tr>
</table>

这将找到页面上的所有复选框并禁用它们。如果您只想禁用某些复选框,则可能需要稍微修改一下。

此外,我发现您在不允许使用按钮时为按钮添加禁用类。这仍然允许用户点击按钮,尽管它们的样式就像它们不可点击一样。确保也禁用该按钮:

$("input[type=checkbox]").prop("disabled", true);

修改:完整代码

$(".disablePage").addClass('disabledbutton').prop("disabled", true);
$("#picklistBody").addClass('disabledbutton').prop("disabled", true);

答案 1 :(得分:0)

您在评论中提到,您尝试使用CSS禁用复选框。

大多数版本的IE都不支持pointer-events CSS属性。很长一段时间它只受Chrome支持。有一段时间他们也在考虑弃用它。他们在手机上也有不稳定的报道。

换句话说,不要依赖指针事件;请改用HTML disabled属性。