版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_40179546/article/details/82313465
radio,弹出相应文本框
说明:初始的状态是,隐藏专利名和专利号两个文本输入框 ,当点击有专利,显示两个文本输入框,点击无专利,隐藏文本输入框。项目的技术成果发布表单中的就有该功能的应用。
html:
<!-- 单选项,通过点击某个选项来显示或是隐藏某个元素 -->
<tr>
<td><strong>是否有专利:</strong></td>
<td>
<input type="radio" name="patent" value="1" onchange="chy(this)">有专利
<input type="radio" name="patent" value="0" onchange="chn(this)">无专利
</td>
</tr>
<tr id="patent1" style="display:none">
<td><strong>专利名称</strong></td>
<td><input type="text" class="form-control" placeholder="专利名称,无则不填" name="patent_name"></td>
</tr>
<tr id="patent2" style="display:none">
<td><strong>专利号</strong></td>
<td><input type="text" class="form-control" placeholder="专利号,无则不填" name="patent_id"></td>
</tr>
js:
<script language="javascript">
function chy(obj){
var rr = $("input[type='radio']:checked").val();
if(rr =="1"){
document.getElementById("patent1").style.display="";
document.getElementById("patent2").style.display="";
}
}
function chn(obj){
var rr = $("input[type='radio']:checked").val();
if(rr =="0"){
document.getElementById("patent1").style.display="none";
document.getElementById("patent2").style.display="none";
}
}
</script>