我有一张包含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&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
只能隐藏,但这不是真正的输出。
答案 0 :(得分:5)
如果您有多行,则不应使用多个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&v=2.2.RC2">
<br>
<br>
<div class="answer">
然后你可以用这个简单的JQuery隐藏答案元素......
$(".answer").hide();
要直接回答您的问题,无论如何,您都会在TD元素集合中调用.hide()
函数。
您可以从最后移动.hide()
并输入此行...
if ($divId == 'answer') {
$div.hide();//hide your answer element
var colNum = $(this).cellIndex;
$cells = $cells.add($div);
} //end of if ($divId == 'answer')
...但这可以通过很多代码来实现这么简单的事情
答案 1 :(得分:2)
使用选择器。
给所有答案框一个“答案”
并使用:
$(".answer").hide();
这将使用答案类隐藏所有这些内容。要显示他们,请拨打问题ID和答案类:
$("#Q1 .answer").show();
不幸的是,我不熟悉表格,但我希望答案有一些价值。
编辑以反映评论。
答案 2 :(得分:1)
元素ID最好在整个文档中是唯一的。这不是绝对必需的,但它可以更容易地使用您的元素。在您的情况下,我会将您的所有问题和答案ID属性更改为类。然后你可以这样做来隐藏你的所有答案:
$('#faqGrid tr td div.answer').hide();