为什么没有Style.Display =无工作使我的按钮不可见?

时间:2016-11-07 20:43:30

标签: javascript html

我写了一个调用onClick的简单函数。当选择一个按钮时,应该根据该特定选择使下一组按钮可见不可见。我已经尝试了多种方法让它工作,并且它们似乎都没有让按钮在函数运行后变得不可见。

这是我到目前为止所拥有的......

function hiddenMess(){

if (document.getElementById('Selection8').checked) {
    document.all('customChoice1').style.visibility = 'hidden';        
    document.getElementById('customChoice1').style.visibility =  'hidden';   
    document.getElementById('customChoice1').style.display = 'none';
}

我使用了其中的所有3个,希望其中一个可以工作,然后我可以消除其他两个。

调用它的按钮就像这样设置

<div class="radio">
  <label><input type="radio" id='Selection8' name="SelectionVal" value="222"  OnClick="hiddenMess()">Test Button 8</label>
</div>
}

这是我试图隐藏的按钮。

<input type="radio" id="customChoice1" name="customDChoice"  value="Hello" > Hello"<br>

1 个答案:

答案 0 :(得分:2)

您的代码成功隐藏了单选按钮本身,但未隐藏标签。在这里,我们以包裹收音机的标签为目标:

function hiddenMess(){

  if (document.getElementById('Selection8').checked) {  
      document.getElementById('customChoice1').style.display = 'none';
  }
}
<div class="radio">
                 <label><input type="radio" id='Selection8' name="SelectionVal" value="222"  OnClick="hiddenMess()">Test Button 8</label>
             </div>
<br>
<hr>
<br>

   <label id="customChoice1"><input type="radio" name="customDChoice" value="Hello">Hello</label>