Question

假设我有很多div：数十，数百，数千，我正在使用php循环创建。我希望通过单击其关联的其他人来滑动切换。我可以使用php为每个人提供一个独特的类名，如name1，name2，name3等。

如何使用1个jQuery函数来处理每个div和相关的div？我能想出的唯一解决方案是使用PHP为每个div及其相关的div输出一个函数。

即

<?php
echo '<script>';
    for(int x=0; x < numDivPairs; x++ ) {
        $( ".slideme".concat(x) ).hide(); //for every line of jquery, something like this
echo '</script>';
?>

我敢肯定，这是一种可怕的做法，如果没有其他原因，它会大大增加页面加载时间。必须有一个更优雅的解决方案。

示例：http://jsfiddle.net/farghole22/uvfh1znr/

Answer 1

由于您的班级名称以name开头，因此您可以将属性启动与选择器一起使用。

$("[class^='name']").click(function(){
    $(this).toggleClass("nameDown").next().slideToggle();

});

仅供参考 - 您可以为多个元素使用相同的类名

Fiddle

Answer 2

使用相同的class名称和next查找当前元素的下一个div。这可以提供帮助 -

<强> HTML

<div class="name">click me</div>
<div class="slideme">asdfojpasdfoiasdjasodijasdoifjasdf</div>
<hr>
<div class="name">click me</div>
<div class="slideme">asdfojpasdfoiasdjasodijasdoifjasdf</div>
<hr>
<div class="name">click me</div>
<div class="slideme">asdfojpasdfoiasdjasodijasdoifjasdf</div>

<强>的jQuery

$(document).ready(function(){
    $(".name").click(function(){
        $(this).toggleClass("nameDown").next(".slideme").slideToggle();
    });
});

DEMO

JQuery 1功能很多div

2 个答案: