Question

我有以下格式的复选框：

<input type="checkbox" id="Ancient" name="tag" value="Ancient" checked="checked" 
onclick="calc();"> Ancient<br>

window.onload =开头没有function Calc()我点击的每个复选框都会显示此内容：

未捕获的TypeError：无法读取null的“已检查”属性在calc

使用window.onload =我收到相同的错误，但我没有点击复选框，它就在那里，并且引用了第一个实例：

if (document.getElementById('Ancient,Commemorative').checked){   
  $(".Ancient,Commemorative").show();
}else {
  $(".Ancient,Commemorative").hide();
}

当我选择其他复选框时，如果之前没有window.onload，则不会发生错误。

我不知道是不是因为这个结果有两个标签而且逗号导致了问题？

当包含window.onload =时，我也会为每个复选框获取此信息，我点击：

未捕获的ReferenceError：未定义calc 在HTMLInputElement.onclick

这是我的代码：

<script>
window.onload =  function calc(){  
    <?php
    foreach ($coins as $coin){
    ?>

        if (document.getElementById('<?php echo $coin->tags ?>').checked){   
          $(".<?php echo $coin->tags ?>").show();
        }else {
          $(".<?php echo $coin->tags ?>").hide();
        }

    <?php   
    }
    ?>  
};
</script>

有人可以解释我是如何处理这个问题的吗？

我添加了window.onload，最初认为javascript代码在DOM准备好之前正在执行。也许这是正确的，因为我现在没有得到所有结果，只有第一个，恰好有两个硬币标签。

Answer 1

使用课程
使用jQuery，因为你拥有它

我的猜测没有看到你的HTML

<input type="checkbox" id="Ancient" name="tag" value="Ancient" checked="checked" class="cointag"> Ancient<br>

$(function() { // on page load
  $(".cointag").on("click",function() {
     $("."+this.id).toggle(this.checked);
  });
});

或者假设你想要显示一个组合：

正在进行的工作：https://jsfiddle.net/mplungjan/u0fnsj43/

function showCoins() {
  var clsses = $(".cointag:checked").map(function() {
    return this.id;
  }).get();
  $(".coins").hide();
  if (clsses.length > 0) {
    console.log("."+clsses.join(",."))
    $("." + clsses.join(",.")).show();
  }  

}

$(function() { // on page load
  $(".cointag").on("click", showCoins);
  showCoins(); // in case some are already checked at load
});

为什么属性null和函数未定义

1 个答案: