Question

我试图在jquery中隐藏一个很容易用hide函数完成的div。但它不起作用.Div是

<div id="antivirusAlertDiv">
            <ul class="shielding_elements">
                <li>
                    <%= Html.RadioButton("antivirusAlertType", 0, antivirusAlertType == AntivirusAlertType.AlertMe ? true : false)%>
                    <label for="id_4">
                        Alert Me</label>
                </li>
                <li>
                    <%= Html.RadioButton("antivirusAlertType", 0, antivirusAlertType == AntivirusAlertType.DonotAlert ? true : false)%>
                    <label for="id_5">
                        Don’t Alert</label>
                </li>
            </ul>
        </div>

jquery代码是：

function ShowAndHide(id, state) {
        var $mydiv = $('#antivirusAlertDiv');
        if (state == false) {
            $mydiv.hide().html('');
            //  $('#uniform-antivirusAlertType').hide();
          //  $('#antivirusAlertDiv .shielding_elements li').hide();
            // $("input[name='antivirusAlertType']").attr("disabled","disabled");
            //                $("#" + id).addClass("hide");
            //                $("#" + id).removeClass("show");
        }
        else {
                  $mydiv.show();
            //$('#uniform-antivirusAlertType').show();
           // $('#antivirusAlertDiv .shielding_elements li').show();
            //$("input[name='antivirusAlertType']").removeAttr("disabled");
            //                $("#" + id).removeClass("hide");
            //                $("#" + id).addClass("show");
        }
    }

Answer 1

使用.toggle()。但是，您需要实际绑定它到某个事件。例如，如果HTML看起来像这样：

<button id="clickme">Click to toggle</button>

<div id="antivirusAlertDiv">
    <!-- snip -->
</div>

然后在document ready handler，

$('#clickme').click(function ()
{
    $('#antivirusAlertDiv').toggle();
});

演示：http://jsfiddle.net/mattball/rPYLK/

N.B。 您可以按如下方式简化现有代码：

<div id="antivirusAlertDiv">
    <ul class="shielding_elements">
        <li>
            <label>
                <%= Html.RadioButton("antivirusAlertType", 0, antivirusAlertType == AntivirusAlertType.AlertMe)%>
                Alert Me
            </label>
        </li>
        <li>
            <label>
                <%= Html.RadioButton("antivirusAlertType", 0, antivirusAlertType == AntivirusAlertType.DonotAlert)%>
                Don’t Alert
            </label>
        </li>
    </ul>
</div>

条件运算符是冗余的
将<label>包裹在相应的输入周围，for属性可以省略

使用Jquery隐藏和显示div

1 个答案: