4

我有以下html

<div class="someClass">  
    Some text  
</div>  
<div class="someClass">  
    Some other text  
</div>
<div class="add>
    <img src="someImage.jpg">
</div>

现在，我想在单击添加图像后附加另一个div - 但仅在最后一个具有“someClass”类的 div 之后。

如果我使用下面的 jQuery，它将被附加在每个 someClass 元素之后，所以多次。

$(".add img").live("click", function() {
    $(".containerFooter").after("<div class='someClass'>test</div>");
});

有没有办法只在带有 someClass 属性的最后一个 div 之后附加它？

4

6 回答 6

6

您正在寻找:last选择器：

$(".someClass:last").after("<div class='someClass'>test</div>");
于 2012-06-22T20:19:08.673 回答
2 
$('.someClass').last()

或者

$('.someClass:last')

会给你类的最后一个元素someclass

于 2012-06-22T20:19:26.137 回答
1

Use:

$(".someClass").last().append("<div class='someClass'>test</div>");
于 2012-06-22T20:19:47.073 回答
1

抱歉，第一次尝试完全阅读了这个问题，更新了答案！

你的 html 也有错别字，它使它

工作演示 

$(".someClass").last() //-> selects your last div with id = someClass

.after("<div class='someClass'>test</div>");//-> place the html after the selected div

下面的实际代码

   $(".add").live("click", function(){
  $(".someClass").last().after("<div class='someClass'>test</div>");
});
​
    ​
于 2012-06-22T20:22:00.450 回答
1 
$(".add img").live("click", function() {
    $(".someClass:last").after("<div class='someClass'>test</div>");
});
于 2012-06-22T20:25:00.753 回答
0

可能有更简单的方法，但 jquery 类返回一个适用对象的数组。所以你可以找到最后一个这样的对象，从中创建一个新的 jquery 对象，然后对其进行操作。

<html><title>JQuery Play</title>
<h1>JQuery Play</h1>
<script src="jquery-1.4.1.js" type="text/javascript" ></script>
<script type="text/javascript">
function add()
{
var x=$(".someClass");
$(x[x.length-1]).after("Added text");
}
</script>
<div class="someClass">   
    Some text   
</div>   
<div class="someClass">   
    Some other text   
</div> 
<div class="add"> 
    <button onclick="add()">Add</button>
</div> 

</html>
于 2012-06-22T20:25:28.697 回答