jquery - jQuery 在 IE8 中的 div 上更改 contenteditable

Question

我有一个可编辑的 div 标签。然后我有一个复选框，我选中或取消选中它我希望 div 标签在可编辑和不可编辑之间切换。我的代码适用于 chrome 和 ff，但不适用于 IE8。

 if ($("#makeedit").prop("checked"))
{
    $("#RiskScoreTextArea").contenteditable("true");
    //$("#RiskScoreTextArea").prop("contenteditable", true);
} else {
    //$("#RiskScoreTextArea").prop("contenteditable", false);
    $("#RiskScoreTextArea").contenteditable("false");

}

}

如您所见，我尝试了许多不同的变体。但它不起作用:(

Answer 1

您可能想尝试以下代码：

JavaScript：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    <script type="text/javascript">
      $(document).ready(function(){
          $('#makeedit').on('click',function(){

            if(!$(this).is(':checked'))
                $('#RiskScoreTextArea').removeAttr('contenteditable');
            else
                $('#RiskScoreTextArea').attr({ contenteditable: 'true' });
          });
        });
    </script>

HTML：

 <input type="checkbox" id="makeedit" />
    <div id="RiskScoreTextArea" style="width:100;height:100;border:1px;border-color:red;border-bottom-width: 1px;border-radius: 1px;border-style: dotted;">
      this is div
    </div>

Answer 2

尝试手动切换属性：

if (!$('#makeedit').prop('checked'))
    $('#RiskScoreTextArea').removeAttr('contenteditable');
else
    $('#RiskScoreTextArea').attr({ contenteditable: 'true' });

http://jsfiddle.net/RY7q9/show/