javascript 根据单选框的值,来决定页面显示的方法

来源:互联网 发布:多源数据 编辑:程序博客网 时间:2024/05/18 20:13

<script>
     var oRadios = document.getElementById('selectradio').getElementsByTagName('input');
            for( var i = 0, len = oRadios.length; i < len; i++){
                oRadios[i].onclick = function(){
                    var value = this.value;
                    if( value == 1){
                        //alert('限制');
                         document.getElementById('istimeselect').style.display = 'block';
                        
                    } else if( value == 0){
                        //alert('i 限制');
                        document.getElementById('istimeselect').style.display = 'none';    //这里要注意了,display不显示时值一定要是'none',不能为空
                    }
                }
            } 
    </script>



来源: http://zhidao.baidu.com/question/446975158.html

<div class="demo">
            <div id="radios" class="radios">
                <input type="radio" name="r" id="r1" value="1" /> 单选框1
                <input type="radio" name="r" id="r2" value="2" /> 单选框2
            </div>
            <div id="tables" class="tables">
                <table id="tb1" class="tb">
                    <tbody>
                        <tr>
                            <td>table1</td>
                            <td>table1</td>
                            

                        </tr>
                        <tr>
                            <td>table1</td>
                            <td>table1</td>
                            

                        </tr>
                    </tbody>
                </table>
                <table id="tb2" class="tb">
                    <tbody>
                        <tr>
                            <td>table2</td>
                            <td>table2</td>
                           </tr>
                        <tr>
                            <td>table2</td>
                            <td>table2</td>
                            

                        </tr>
                    </tbody>
                </table>
            </div>
             </div>
<script>
var oRadios = document.getElementById('radios').getElementsByTagName('input');
        for( var i = 0, len = oRadios.length; i < len; i++){
            oRadios[i].onclick = function(){
                var value = this.value;
                if( value == 1){
                    document.getElementById('tb2').style.display = 'none';
                    document.getElementById('tb1').style.display = 'block';
                    
                } else if( value == 2){
                    document.getElementById('tb1').style.display = 'none';
                    document.getElementById('tb2').style.display = 'block';
                }
            }
        }

</script>

按钮控制显示:

<script>
    $('#isadd').click(function(){
        $('#doadd').toggle();
    });
</script>