动态选择器与jQuery的同时循环

我有一个while循环创建一个锚定标记的列表，每个具有唯一的类名从1开始计数，然后有很多项目。我想改变一个CSS attriubute在一个特定的锚点标签和类，当它被点击，所以可以说背景颜色改变了。这里是我的代码动态选择器与jQuery的同时循环

while($row = mysql_fetch_array($results)){ 
$title = $row['title']; 
$i++; 
echo "<a class='$i'>$title</a> 

}

我想我了jQuery是这个样子，它显然会比这更复杂，我只是困惑，从哪里开始。

$(document).ready(function() { 
$('a .1 .2 .3 .4 and so on').click(function() { 
$('a ./*whichever class was clicked*/').css('background':'red'); 
     }); 
    });

来源

2010-06-06 Cool Guy Yo

而不是“唯一”类，我会使用ID。而且，无论点击哪个链接，似乎都会执行相同的操作，为什么不给他们一个共同的类。这是什么类，分配类似的行为/属性，以便多个元素。 – 2010-06-06 21:39:06

我刚刚注意到的另一个错误（并在我的答案中得到了更正）是，在'.css（）'调用中使用'：'作为分隔符而不是'''，而不是''。只有当您将一个对象传递给'.css（）'时，冒号才会使用。 – user113716 2010-06-06 21:43:40

我同意@Felix。除非您将类名用作数字的特定目的（例如，如果您将具有其他具有相同类名的元素），则ID通常用作唯一标识符（尽管作为ID的单个数字无效），而类可能是相同的。索引号也可以在自定义属性中传递。 – user113716 2010-06-06 21:48:34

你可以给班级一个更一致的名字吗？像myClass_1，myClass_2等

然后，你可以这样做：

$(document).ready(function() { 
    $('a[class^=myClass_]').click(function() { // Assign handler to elements with a 
               // class that starts with 'myClass_' 
     $(this).css('background','red'); // Change background of clicked one. 

    }); 
});

这里，选择“开头”用于将事件指派给与myClass开始的所有类。

如果需要，您仍然可以检索索引编号。

在事件处理程序中，$(this)指的是被点击的那个。

活生生的例子：http://jsfiddle.net/Jurv3/

文档的 “开头” 选择：http://api.jquery.com/attribute-starts-with-selector/

编辑：我选择了失踪]。现在修复。

来源

2010-06-06 21:24:08 user113716

如果您指的是$（this） – colinmarc 2010-06-06 22:30:18

@colinmarc，那么没有理由给每个独特的课程.OP由于某种原因使用了独特的课程，因此我的答案反映了OP的要求。可能会有其他元素集使用相同的类名生成。 – user113716 2010-06-06 22:53:39

您可以使用一个迭代器在一个这样的数组：

var myclasses = [".1",".2",".3"]; // generated by php 

$.each(myclasses, function(index, value) { 
    $('a '+value).click(function() { 
     $(this).css('background':'red'); 
    }); 
});

注：我想你可能在你的锚标记列表使用唯一的ID为每个项目变得更好，并有他们都有一个班级。这更多的是类和ID。

来源

2010-06-06 21:23:40 Keltex

只要给他们所有相同的班级，说，myClass。然后： - 只要链接和目标之间的关系是每个相同

$('a.myClass').click(function() { 
    $(this).css('background':'red'); 
});

为您遇到的链接对自己的工作，或者在他们的父母这样，只要工作。要操作父项，它将是$(this).parent().css(...)，并且对下一个元素进行操作，它将是$(this).next().css(...)等等。

来源

2010-06-06 21:30:59 colinmarc

您不需要使用'each（）'将处理程序分配给所有'myClass'元素。 – user113716 2010-06-06 21:40:33

啊，你说得对。我的错误，我会编辑 – colinmarc 2010-06-06 21:50:00

你有没有试过类似的东西？

while($row = mysql_fetch_array($results)){ 
$title = $row['title']; 
$i++; 
echo '<a class="anchor_link" id="'.$i.'">'.$title.'</a>'; 

}

然后在jQuery的：

$(document).ready(function() { 
    $('a.anchor_link').click(function() { 
     var thisAnchor = $(this).attr('id'); 
     $(this).css('background':'red'); 
    }); 
});

原因我加入JS变种“thisAnchor”是因为我假设你需要$我的PHP变量作为锚定标志？如果是这样，你可以采取js var并使用它，但是你需要。如果因为锚定的内容由id标记而无法使用ID，请使用不同的attr，例如'title'或'alt'。

我希望这是有帮助的。

来源

2010-06-06 22:35:54 Jubair

回答

相关问题