HTMer » 编程开发 » 点击单选接钮后显示隐藏层的方法

点击单选接钮后显示隐藏层的方法

今天在做网页时用到了用户提交意见表单,需要用户按照指定的意见进行选择,或者自已提出新意见,如果提出新意见,其实就是点击单选接钮后显示隐藏层,现把相关代码拿来分享。

运行效果图如下所示:

原理就是利用单选按钮的onclick事件来控制文本域的样式为显示或者隐藏,相关代码如下所示:

<form action="" method="get">
请选择您的意见:
<input type="radio" name="radiobutton" onclick="htmer.style.display='none'" />优秀
<input type="radio" name="radiobutton" onclick="htmer.style.display='none'" />良好
<input type="radio" name="radiobutton" onclick="htmer.style.display='none'" />好
<input type="radio" name="radiobutton" onclick="htmer.style.display='none'" />不好
<input type="radio" name="radiobutton" onclick="htmer.style.display=''" />自定义意见<br />
<textarea id="htmer" rows="5" style="display:none">当你选择【自定义意见】后,这部分内容将显示出来让用户填写。
</textarea>
<input type="submit" name="Submit" value="提交">
</form>
顶一下 ▲()   踩一下 ▼()

相关文章