Question

我在玩一些代码时遇到以下情况，其中在表格标签上切换将属性样式设置为＆＃34; display：table＆＃34;而不是＆＃34;显示：块＆＃34;。（您需要使用像firebug这样的开发人员工具来查看此行为）。根据我的理解，切换只将显示设置为“没有”。或者＆＃39;阻止＆＃39;。

以下是代码：

<button class="read">Toggle Table</button>
<table class="displayReviews"></table>
<br>
<button class="write">Toggle Form</button>
    <form class="writeForm">Form</form>

<script>
$('button').click(function() {
   if($(this).attr("class") == "read")
   {
       $(".displayReviews").toggle();
   }
   else if($(this).attr("class") == "write")
   {
       $(".writeForm").toggle();
   }    
});
</script>

<style>
.writeForm
{
    display:none;    
}

.displayReviews
{
   display:none;    
}
</style>

jsfiddle：https://jsfiddle.net/thL7Lyff/

有人能帮我理解为什么会这样吗？在此先感谢。

Answer 1

<script>
$('button').click(function() {
   if($(this).attr("class") == "read")
   {

     if($(".displayReviews").css("display") == "none"){
       $(".displayReviews").css("display", "block");
     } else {
      $(".displayReviews").css("display", "none");
     }

   }
   else if($(this).attr("class") == "write")
   {
       $(".writeForm").toggle();
   }    
});
</script>

jquery toggle将属性设置为display：table而不是block

1 个答案: