码迷,mamicode.com
首页 > Web开发 > 详细

JQuery通过radio,select改变隐藏显示div

时间:2021-07-05 18:15:19      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:period   bsp   strong   input   function   style   cti   下拉   func   

1)select下拉框控制div的隐藏与显示

script>
    function checkYear() {
        var selectValue = $("select[name=‘periodType‘]").val();
        if(selectValue == 1){
            $("#isPeriodYearHalf").hide();
        }
        if(selectValue == 2){
            $("#isPeriodYearHalf").show();
        }
    }
</script>
 
<pre name="code" class="java"><span>报表类型:
     <select name="periodType" onchange="checkYear();">
       <option value="1">年报</option>
       <option value="2">半年报</option>
     </select>
</span>
<span id="isPeriodYearHalf" style="display:none">报表半年:
     <select name="periodYearHalf">
        <option value="1">上半年</option>
        <option value="2">下半年</option>
     </select>
</span>

  

2)radio单选框控制div的隐藏与显示

技术图片

 

<script>
    $(function(){
        var isPermanentValue = $(input[name="isPermanent"]:checked ).val();
        if(isPermanentValue == 1){
            $("#validityPeriodTime").hide();
        }
        if(isPermanentValue == 0){
            $("#validityPeriodTime").show();
        }
        $(".merchantzc_radio").click(function(){
            var isPermanentValue = $(input[name="isPermanent"]:checked ).val();
            if(isPermanentValue == 1){
                $("#validityPeriodTime").hide();
            }
            if(isPermanentValue == 0){
                $("#validityPeriodTime").show();
            }
        })
    })
</script>
<pre name="code" class="java"><li>
    <span>永久有效:</span>
    <div>
        <div>
            <input type="radio" name="isPermanent"  class="merchantzc_radio" value="1"></div>
        <div>
            <input type="radio" name="isPermanent" checked class="merchantzc_radio" value="0"></div>
    </div>
</li>

 

JQuery通过radio,select改变隐藏显示div

标签:period   bsp   strong   input   function   style   cti   下拉   func   

原文地址:https://www.cnblogs.com/yuan9580/p/14966367.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!