Question

我在javascript Hide/show div on checkbox: checked/unchecked使用了Javascript。

$scope.$watch('user_certificates', function(newVal){
    $scope.hasCerts = !!newVal.length;
});




<div ng-hide="hasCerts">
    <div ng-click="showAddCertForm()">
        <span class="btn btn-default">Add Certificate</span>
    </div>
</div>

我改变了“checkBox.checked = false;” to“checkBox.checked = true;” 无论如何它仍然有效但产生错误： 未捕获的TypeError：无法将属性'checked'设为null

Demo

在这种情况下，我如何修复此错误？

感谢。

Answer 1

小提琴很好用。唯一的问题可能是在复选框是DOM的一部分之前执行脚本。

将您的代码包装在onload事件中。

window.onload = function() {
    var elem = document.getElementById('powermail_fieldwrap_331'),
    checkBox = document.getElementById('powermail_field_doruovaciaadresa2_1');
    checkBox.checked = false;
    checkBox.onchange = function doruc() {
        elem.style.display = this.checked ? 'block' : 'none';
    };
    checkBox.onchange();
};

或者确保在复选框是DOM的一部分之后写入脚本标记：

<label>
    <input type="checkbox" id="powermail_field_doruovaciaadresa2_1" checked="checked" />
    Show/hide
</label>
<div id="powermail_fieldwrap_331">Lorem ipsum</div>

<script>
var elem = document.getElementById('powermail_fieldwrap_331'),
    checkBox = document.getElementById('powermail_field_doruovaciaadresa2_1');
    checkBox.checked = true;
    checkBox.onchange = function() {
        elem.style.display = this.checked ? 'block' : 'none';
    };
    checkBox.onchange();
</script>

Answer 2

您的代码在文档完全就绪之前执行，这会导致您将ID作为null接收，因为它尚未呈现。

这是一个常见问题，这就是为什么在jquery中你总是使用$(document).ready();

要确保文档首先完全加载，并且在文档完全加载之前不会执行任何元素，从而防止出现这样的错误。

在java脚本中有一个非常有用的帖子：

Pure java script jquery ready

Answer 3

您需要更改所有标签而未选中通过

Answer 4

您的document.getElementById（“ checkboxid”）包含空值。对于那个存储在一个变量，然后你可以像

  var checkbox = document.getElementById("chkteam");
        if (checkbox == true) {

         // your condition 
        }

然后它将起作用。

未捕获的TypeError：无法将属性'checked'设置为null

4 个答案: