2011-06-04 149 views
1

我想隐藏一个在jquery中用隐藏功能轻松完成的div。但它不是working.The DIV是使用Jquery隐藏和显示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"); 
     } 
    } 
+1

我缺少它,还是你实际上并没有在任何地方绑定一个事件? – Khepri 2011-06-04 05:16:36

+1

也,你设置html为空;当再次显示时,将不会显示任何内容。 (为什么你删除html ??) – mpen 2011-06-04 05:18:00

回答

2

使用.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/


注:可以简化现有的代码如下:

<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属性可被省略
+0

谢谢你的答案它的工作 – 2011-06-04 06:27:01