jquery根据单选radio值的不同显示不同内容

网上看了一些资料,一些不能实现,记录下,以后参考:

html:

        <div class="form-group">
            <label class="col-sm-3 control-label">是否通过:</label>
            <div class="col-sm-8">
                <div class="radio-inline check-box">
                    <label>
                        <input type="radio" checked="" value="1" name="state"> <i></i>通过</label>
                </div>
                <div class="radio-inline check-box">
                    <label>
                        <input type="radio" value="2" name="state"> 不通过</label>
                </div>
            </div>
        </div>

    <div id="pastBox">
           1
        </div>

        <div class="form-group" id="remarkBox">
            2
        </div>

js:

    $(function () {
        // 默认选中“通过”,隐藏2
        $("#remarkBox").hide();
        // 根据"radio的1和2展示不同的内容
        $("input[name='state']").change(function () {
            var num = $('input:radio[name="state"]:checked').val();
            if (num == 2) {
                $("#pastBox").hide();
                $("#remarkBox").show();
            } else {
                $("#remarkBox").hide();
                $("#pastBox").show();
            }
        });
    })

以上;

上一篇:组件icon、radio、checkbox(10)


下一篇:单选框单击取消选中