有没有办法让这个jquery脚本动态化？

我正在使用此jquery代码在我的页面上显示和隐藏div。 如你所见，我限制为5个div。 有没有办法让它们充满活力？

$(document).ready(function() { $('.box').hide(); $('a.toggle').click(function() { $('.box').toggle(400); return false; }); }); 

---

  
hidden content 

这是我修改后的代码

 $(function () { $('div.box').hide(); $('a.toggle').click(function () { $(this).next('div.box').toggle(400); }); }); 

---

 
 
Title
 
content
 
Posted by Admin
    
 
Hidden 

Answer 1

看看你的标记，你可以这样做：

 $(document).ready(function () { $('div.box').hide(); $('a.toggle').click(function () { // all A elements with class 'toggle' $(this).next('div.box').toggle(400); // toggle the next DIV with class 'box' }); }); 

基本上将单击处理程序绑定到具有类toggle所有链接，然后单击它们时，它将使用遍历/下一个function查找下一个兄弟（ 相对于单击的链接 ），它是带有类box的div 。

在这里用你的标记检查上面的例子。

编辑：我查看了你的标记，你的.toggle链接嵌套在div.entry元素中，还有一个未封闭的段落，所以我再次将代码调整到你的标记：

 $(function () { $('div.box').hide(); $('a.toggle').click(function () { $(this).parents('.entry').next('div.box').toggle(400); }); }); 

你会注意到我寻找div.entry元素，因为.box是它们的兄弟。

在此处查看更新示例。