Question

onclick事件无效。当我点击复选框时，没有任何内容出现。这是我的代码：

function showHide() 
{
    var checkbox1=document.getElementById("iconbox");
    var hiddeninputs=document.getElementsByClassName("hidden");
    for (var i=0;i!=hiddeninputs.length;i++){
        if(checkbox1.checked){
            hiddeninputs[i].style.display="block";          
        }
    }   
}

.hidden {
  display: none;
}

<form action="#" name="form1">
      <input type="checkbox" name="iconbox" id="iconbox"onclick="showHide()"/>
      <label for="iconbox">Manage your header</label>
      <input type="text" name="icon1" id="icon1" class="hidden">
      <input type="text" name="icon2" id="icon2" class="hidden">
</form>

Answer 1

使用class =＆＃34;隐藏＆＃34;隐藏元素并尝试使用display =＆＃34; block＆＃34;来显示它们。你应该隐藏起来display =＆＃34; none＆＃34;并显示display =＆＃34; block＆＃34; 或隐藏与类=＆＃34;隐藏＆＃34;并显示删除类＆＃34;隐藏＆＃34;使用javascript的删除功能。

Answer 2

这是你期待的吗？

＆＃13;

function showHide() {
  var checked = document.getElementById("iconbox").checked;
  var hiddeninputs = document.getElementsByClassName("hidden");
  for (var i = 0; i != hiddeninputs.length; i++)
    hiddeninputs[i].style.display = (checked) ? "block" : "none";
}

＆＃13;

.hidden {
  display: none;
}

＆＃13;

<form action="#" name="form1">
  <input type="checkbox" name="iconbox" id="iconbox" onclick="showHide()" />
  <label for="iconbox">Manage your header</label>
  <input type="text" name="icon1" id="icon1" class="hidden">
  <input type="text" name="icon2" id="icon2" class="hidden">
</form>

＆＃13;

onClick事件不起作用

2 个答案: