Question

我正试图点击我的幻灯片切换但是没有按预期工作。每次点击仅适用于第一个div。

HTML代码：

<div id="toggle">
    <span id="down"></span>
    <a id ="slide" href="#">Passende Produkte zum Gutschein</br></a>
    <div id="inner">text tetxtext</div>

    <span id="down"></span>
    <a id ="slide" href="#">Passende Produkte zum Gutschein</a>
    <div id="inner">text tetxtext</div>
</div>

JS代码：

$('a').click(function() {
    $('#inner').slideToggle('fast');    
});

CSS：

#inner {
    display:none;
}

我的结果位于here。

Answer 1

ID必须是唯一的，你应该使用类，而你还没有在jsfiddle中加载jQuery。

<div id="toggle">
    <span class="down"></span>
    <a class="slide" href="#">Passende Produkte zum Gutschein</br></a>
    <div class="inner">text tetxtext</div>

    <span class="down"></span>
    <a class="slide" href="#">Passende Produkte zum Gutschein</a>
    <div class="inner">text tetxtext</div>
</div>

根据您的标记，您可以使用next或siblings方法。

$('a').click(function(event){
   $(this).next('.inner').slideToggle('fast');
   // $(this).siblings('.inner').slideToggle('fast'); 
   event.preventDefault() // prevents the default action of event.       
});

http://jsfiddle.net/Wh5u2/

Jquery幻灯片切换问题

1 个答案: