这个jQuery slideToggle函数有什么问题？

我有一个票务管理程序，我试图添加'手风琴'风格的功能，以使用jQuery。这个程序是用PHP编写的。输出的HTML如下所示：这个jQuery slideToggle函数有什么问题？

<div class="eachticketwrapper"> 
    <div class="simpleticketview"> 
      <ul class="displayinline ticketsummarybar"> 
        <li class="col0"><a href="#" class="toggleLink">E</a></li> 
         //... 
      </ul> 
     </div> <!-- simpleticketview --> 
<br class="clear" /> 
<div class="toggle"> <!-- hiddenticketview --> 
    //... 
</div>

这会在页面上重复数十次。

我的jQuery代码看起来是这样的：

$(document).ready(function() { 
    $('div.toggle').hide(); 
    $('.toggleLink').click(function() { 
     $(this).next('div.toggle').slideToggle('fast'); 
    return false; 
    }); 
});

当我点击在E也不会滑动下一格。实际上没有任何反应。

我试过使用： $（'div.toggle'）。slideToggle（'slow'）;

这导致所有div切换。但我需要它来瞄准NEXT div。

在此先感谢。

来源

2009-06-19 HeavyObjectLifter

你需要给你的'切换'div一个唯一的ID和匹配你的链接ID。然后针对这些ID：

<div class="eachticketwrapper">  
    <div class="simpleticketview">   
     <ul class="displayinline ticketsummarybar"> 
       <li class="col0"><a href="#" id="link-1234" class="toggleLink">E</a></li> 
        //...   </ul> 
    </div> <!-- simpleticketview --> 
    <br class="clear" /> 
    <div id="ticket-1234" class="toggle"> <!-- hiddenticketview -->  
    //... 
    </div>

的jQuery：

$(document).ready(function() { 
    $('div.toggle').hide(); 
    $('.toggleLink').click(function() { 
     var id = $(this).attr("id").split("-"); 
     $("#ticket-" + id[1]).slideToggle('fast'); return false; 
    }); 
});

来源

2009-06-19 17:27:51 Jason

谢谢你的回应杰森！有没有什么办法可以避免提供一个唯一的ID？我认为jQuery的力量之美来自事实，我可以简单地说下一个.toggle div？错误是真的？ – HeavyObjectLifter 2009-06-19 18:54:04

你可以在div没有ID，但它会以某种复杂：

$(this).parents().find("div.eachticketwrapper").nextAll().find("div.toggle:first")

这取决于结构你的文件。如果您有多个每个包装纸元素，则可能需要对其进行调整。最好使用一个id。

来源

2009-06-19 19:08:37 kgiannakakis

这个jQuery slideToggle函数有什么问题？

回答

相关问题