所以我有基于网格的布局:
<div id="gridrow" class="clear">
<div id="gridsection" class="float-left">
<div id="gridwrap">
<div id="gridimage" class="clear"></div>
<div id="gridtitle" class="clear">Title</div>
<div id="gridinfo" class="clear">Info</div>
</div>
</div>
<div id="gridsection" class="float-right">
<div id="gridwrap">
<div id="gridimage" class="clear"></div>
<div id="gridtitle" class="clear">Title</div>
<div id="gridinfo" class="clear">Info</div>
</div>
</div>
<div id="gridsection" class="gridmiddle">
<div id="gridwrap">
<div id="gridimage" class="clear"></div>
<div id="gridtitle" class="clear">Title</div>
<div id="gridinfo" class="clear">Info</div>
</div>
</div>
然后我有这个jQuery脚本:
$("#gridtitle").each(function(index){
$("#gridtitle:eq("+index+")").click(function (){
$("#gridimage:eq("+index+"), #gridinfo:eq("+index+")").slideToggle();
});
});
我认为这会起作用(具有逻辑意义)然而,只有第一个网格元素可以工作,任何提示?
欲了解更多信息,请随时提出,
感谢。
答案 0 :(得分:2)
不同的元素必须具有不同的ID。
如果两个或多个元素具有相同的ID,则仅使用第一个元素。
答案 1 :(得分:1)
ID是唯一的,每个对象只能使用一个。您可以使用分类,并更改选择器:
$(".gridtitle").each(function(index){
$(".gridtitle:eq("+index+")").click(function (){
$(".gridimage:eq("+index+"),.gridinfo:eq("+index+")").slideToggle();
});
});
答案 2 :(得分:0)
那是因为gridtitle
是id
。您应该将其更改为class
并选择它:
$(".gridtitle").each(function() { ... });