我在4个div之间切换时遇到问题。我不知道为什么它不起作用。它只是向我显示了第一格,什么也没做。当我在另一个网页上使用它时,它可以工作。
代码如下:
HTML:
<table style="width: 75%; border: 0; text-align: center; margin: 0 auto;" align="center" padding="10"><tr>
<td width="50%" align="center"><a class="ukaz" target="1"></a></td>
<td width="50%" align="center"><a class="ukaz" target="2"></a></td></tr>
<tr>
<td width="50%" align="center"><a class="ukaz" target="3"></a></td>
<td width="50%" align="center"><a class="ukaz" target="4"></a></td>
</tr>
</table>
<div id="div1" class="cil" style="display:block;">
text
</div>
<div id="div2" class="cil">
text
</div>
<div id="div3" class="cil">
text
</div>
<div id="div4" class="cil">
text
</div>
CSS:
.cil {
display: none;
}
JS:
jQuery(function () {
jQuery('.ukaz').click(function () {
var index = $(this).index(),
newTarget = jQuery('.cil').eq(index).slideDown();
jQuery('.cil').not(newTarget).slideUp();
});
});
最佳答案
您当前的表达式会找到clicked元素的index
,但它不知道要将index
定位到哪个元素的上下文。您需要使用与类index
匹配的所有元素来找到click元素的.ukaz
$('.ukaz').click(function () {
var index = $('.ukaz').index($(this));
$('.cil').slideUp();
$('.cil').eq(index).slideDown();
});
示例:https://jsfiddle.net/DinoMyte/qgo90beb/1/
关于javascript - jQuery在4个div之间切换,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/35373364/