html输入框消失

Question

我有这个简单的HTML表单。 具有3个单选框选项。 最后一个单选框选项是“其他”，我希望文本框输入其他原因，仅在选择“其他”组合框时才会出现。 有什么办法吗？

<html>
  <body>
    <div class="form-group">

        <input type="radio" name="option" value="a"> Missing deadline.<br>
        <input type="radio" name="option" value="b"> Unsatisfied with the work.<br>
        <input type="radio" name="option" value="c"> No response from Accountant.<br>
        <input type="radio" name="option" value="d"> Other reasons. <br>

        <input autofocus type="text" id="reason" name="reason" placeholder="Please key in the reasons.">

    </div>
  <body>
</html>

Answer 1

试试看。

 function showTextbox() { document.getElementById("reason").style.display = "block"; }

 <html> <body> <div class="form-group"> <input type="radio" name="option" value="a"> Missing deadline.<br> <input type="radio" name="option" value="b"> Unsatisfied with the work.<br> <input type="radio" name="option" value="c"> No response from Accountant.<br> <input type="radio" name="option" value="d" onclick="showTextbox()"> Other reasons. <br> <input autofocus type="text" id="reason" name="reason" placeholder="Please key in the reasons." style="display:none"> </div> <body> </html>

Answer 2

这是使用jQuery的解决方案，方法是将复选框设置为on-change事件：

 $("#test").change(function(){ $("#hidden").show() });

 #hidden {display: none}

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> Click Me <input type="checkbox" id="test"> <div id="hidden">alec</div>

html输入框消失

问题描述

2 个解决方案

解决方案1
1 2018-04-09 00:25:52

解决方案2
0 2018-04-09 00:41:19

html输入框消失

问题描述

2 个解决方案

解决方案1 1 2018-04-09 00:25:52

解决方案2 0 2018-04-09 00:41:19

解决方案1
1 2018-04-09 00:25:52

解决方案2
0 2018-04-09 00:41:19