I am trying to hide a div which is easily done with hide function in jquery. But it is not working.The div is
<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 code is:
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");
}
}
Use .toggle()
. However, you need to actually bind it to some event. For example, if the HTML looked like this:
<button id="clickme">Click to toggle</button>
<div id="antivirusAlertDiv">
<!-- snip -->
</div>
Then in a document ready handler,
$('#clickme').click(function ()
{
$('#antivirusAlertDiv').toggle();
});
Demo: http://jsfiddle.net/mattball/rPYLK/
N.B. you can simplify the existing code as follows:
<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>
- The conditional operator is redundant
- Wrap the
<label>
around the corresponding input and thefor
attribute can be omitted
精彩评论