隐藏表格中的div

-1

我想隐藏div 2和div 3。但它不工作。它只有在我将div从表格中拉出后才能使用。任何人都可以向我解释为什么？隐藏表格中的div

脚本

<script> 
     $(document).ready(function(){ 
      $("#2").hide(); 
      $("#3").hide(); 
      }); 
</script>

HTML

<div align="center"> 
    <table width="10%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
     <th scope="row"><table width="100%" border="0" cellspacing="0" cellpadding="0"> 
     <tr> 
     <div id = "1"> 
      <th><input type = "button" value = "1.1" ></th> 
      <th><input type = "button" value = "1.2" ></th> 
      <th><input type = "button" value = "1.3" ></th> 
     </div> 
     <div id = "2"> 
      <th><input type = "button" value = "2.1" ></th> 
      <th><input type = "button" value = "2.2" ></th> 
      <th><input type = "text" value = "2.3" ></th> 
     </div> 
     <div id = "3"> 
      <th><input type = "button" value = "3.1" ></th> 
      <th><input type = "button" value = "3.2" ></th> 
     </div> 
     </tr> 
     </table></th> 
    </tr> 
    </table> 
</div>

来源

2012-10-09 Jonathan Chan

假如你不使用HTML5，id属性不能以数字开头。尝试使用另一个标识符，例如el2。

更新
其实，这个问题是因为div元素不在一个tr有效，因此，浏览器中删除，因此#2选择找到什么好隐瞒的。最好的选择是为每个th添加一个类，您需要隐藏并使用CSS来隐藏它们。

Example fiddle

来源

2012-10-09 09:36:33

试过但它不起作用 –

@JonathanChan看我的upd吃 –

你为什么不给<TH>元素的CSS类，并隐藏起来，而不是在桌子中间引入的DIV，例如：

<script> 
    $(document).ready(function(){ 
     $(".th2").hide(); 
     $(".th3").hide(); 
     }); 
</script>

HTML

<div align="center"> 
<table width="10%" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
    <th scope="row"><table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
     <th class="th1"><input type = "button" value = "OP/FE" ></th> 
     <th class="th1"><input type = "button" value = "LS" ></th> 
     <th class="th1"><input type = "button" value = "FLX" ></th> 
     <th class="th2"><input type = "button" value = "2.1" ></th> 
     <th class="th2"><input type = "button" value = "2.2" ></th> 
     <th class="th2"><input type = "text" value = "2.3" ></th> 
     ... 
    </tr> 
    </table></th> 
</tr> 
</table> 
</div>

来源

2012-10-09 09:41:01 M4N

Please change Div to table and add jqury.js link to page and test it : 
<head> 
<title></title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(function() { 

     $("#div2").hide(); 
     $("#div3").hide(); 
    }); 
</script> 

</head> 

<body> 
    <div align="center"> 
    <table width="10%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
     <th scope="row"><table width="100%" border="0" cellspacing="0" cellpadding="0"> 
     <tr> 
     <table id = "div1"> 
      <th><input type = "button" value = "1.1" ></th> 
      <th><input type = "button" value = "1.2" ></th> 
      <th><input type = "button" value = "1.3" ></th> 
     </table> 
     <table id = "div2"> 
      <th><input type = "button" value = "2.1" ></th> 
      <th><input type = "button" value = "2.2" ></th> 
      <th><input type = "text" value = "2.3" ></th> 
     </table> 
     <table id = "div3"> 
      <th><input type = "button" value = "3.1" ></th> 
      <th><input type = "button" value = "3.2" ></th> 
     </table> 
     </tr> 
     </table></th> 
    </tr> 
    </table> 
</div> 
</body> 

</html>

来源

2012-10-09 09:46:49 jainvikram444

隐藏表格中的div

回答

相关问题