在4个div之间切换

在4个div之间切换

我在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/

10-13 01:51