jQuery中的隐藏元素表

Question

我有一个表tr和td。我的td有一个div作为它的孩子。其中一个div有id="question"，另一个有id="answer"。我想在遍历我的td时，div有id="answer"被隐藏。当页面加载时，只会出现问题div。这里是html的结构

<td style="display: none;"> 
    <div style="border-color: #000000;position: relative;float: right;margin-top: 2px;right: 12%;"> </div> 
    <div style="border-color: #000000;position: relative;float: right;margin-top: 2px;right:-2%;"> </div> 
    <div id="question"> 
     <img id="faqGrid:0:j_idt77" height="10" width="480" src="/TDAP/faces/javax.faces.resource/spacer/dot_clear.gif?ln=primefaces&amp;v=2.2.RC2"> 
     <br> 
     <br> 
    <div id="answer"> 
    <div class="horizontalline"></div> 
</td> 

我做了以下工作。但它隐藏了整个td。

$('#faqGrid tr td').each(function(){ 

    var $cells = $(); 

    /** 
    *Gives you all children as an object array 
    * 0: div 
    * 1: div 
    * 2: div#question 
    * 3: img#faqGrid:0:j_idt77 /TDAP/fa...=2.2.RC2 
    * 4: br 
    * 5: br 
    * 6: div#answer 
    * 7: div.horizontalline 
    */ 
    var tdChildrenArray = $(this).children(); 

    var divChildrenArray = $(this).children('div'); 

    var elementStack; 

    $.each(divChildrenArray, function(index, value){ 

     var $div = value; 

     if ($div.id) { 

      var $divId = $div.id; 

      if ($divId == 'answer') { 

       var colNum = $(this).cellIndex; 
       $cells = $cells.add($div); 

      } //end of if ($divId == 'answer') 

     } //end of if ($div.id) 

    }); //end of $.each(object, fn) 

    return $(this).pushStack($cells); 

}).hide(); //end of $('#faqGrid tr td').each(fn) 

我在这里的想法是，在div的是推栈上只应该隐藏，但是这不是真正的输出。

Answer 1

如果您有多个行，您不应该使用多个ID属性。更改为类，而不是...

<div class="question"> 
    <img id="faqGrid:0:j_idt77" height="10" width="480" src="/TDAP/faces/javax.faces.resource/spacer/dot_clear.gif?ln=primefaces&amp;v=2.2.RC2"> 
    <br> 
    <br> 
<div class="answer"> 

然后你就可以做到这一点简单的jQuery隐藏答案元素...

$(".answer").hide(); 

要回答你直接的问题，你被称为.hide()功能上无论如何，你的TD元素的集合。

你可以从最末端移动.hide()，并把在这条线......

if ($divId == 'answer') { 

    $div.hide();//hide your answer element 
    var colNum = $(this).cellIndex; 
    $cells = $cells.add($div); 

} //end of if ($divId == 'answer') 

...但这是办法不多代码，这么简单的东西

编辑： A Sample of what you might be trying to do

Answer 2

使用选择器。

给所有的答案盒一类的“答案”

和使用：

$(".answer").hide(); 

这将隐藏所有他们的答案类。给他们打电话问题ID和答案类别：

$("#Q1 .answer").show(); 

我不是很熟悉表，但我希望答案有一定的价值。

编辑以反映评论。

Answer 3

元素ID在文档中是唯一的。这不是绝对必要的，但它会使你更容易处理你的元素。在你的情况下，我会改变你的所有问题，并将id属性改为类。然后你可以这样做来隐藏你的答案：

$('#faqGrid tr td div.answer').hide();