我正在创建一个表单字段,我想在其中进行简单的隐藏显示以在单选按钮上显示div。

<form id="basic" name="basic">

<label><input name="formelement" type="radio" value="yes" /> Yes   </label>
<label><input name="formelement" type="radio" value="no" /> No </label>

<div id="yes" style="display: none;">
This is the div that displays that shows when 'Yes' is selected.
</div>

<div id="no" style="display: none;">
This is the div that displays that shows when 'No' is selected.
</div>

</form>


我玩过一些我在网上找到的各种javascript,但并没有取得太大的成功,因为其中大多数都可以隐藏一个div。当选择“否”时使“是”隐藏起来,反之亦然,这是棘手的部分。如果有人可以提供一些帮助,将不胜感激!

最佳答案

只需将这些代码粘贴在head标签之间

<script type="text/javascript">
window.onload=function(){
    var el1 = document.getElementsByName('formelement')[0];
    var el2 = document.getElementsByName('formelement')[1];
    el1.onchange=function(){
        var show=el1.value;
        var hide=el2.value;
        document.getElementById(show).style.display='block';
        document.getElementById(hide).style.display='none';
    }

    el2.onchange=function(){
        var show=el2.value;
        var hide=el1.value;
        document.getElementById(show).style.display='block';
        document.getElementById(hide).style.display='none';
    }
}
</script>


DEMO.

关于javascript - 令人沮丧的简单Java脚本帮助,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/11337725/

10-15 23:11