Question

我正在尝试为任何新添加的id / class添加1：

jQuery的：

$(function(){
$("#add-new-student").click(function() {

$("ul#student-list").append('<li class="student3"/>Student</li>');
$("div#student-courses").append('<div id="student3" class="student-information">'
+ '<div id="student3-enrolled-courses">'
+ '<span class="english">English</span>'
+ '<span class="technology">Technology</span>'
+ '</div>'
+ '</div>'
);

});
});

HTML：

<input type="submit" id="add-new-student" value="Add New Student">

<ul id="student-list">
<li class="student1"/>Student</li>
<li class="student2"/>Student</li>
</ul>

<div id="student-courses">
<div id="student1" class="student-information">
<div id="student1-enrolled-courses">
<span class="english">English</span>
<span class="technology">Technology</span>
</div>
</div>

<div id="student2" class="student-information">
<div id="student2-enrolled-courses">
<span class="english">English</span>
<span class="technology">Technology</span>
</div>
</div>
</div>

我设置了两个小提琴：
http://jsfiddle.net/KHfyY/使用after而不是append并找到div.student-information：last
http://jsfiddle.net/KHfyY/1/使用此处的代码并附加

无论哪一个最适合我们应该是我们可以使用的那个。

如果没有学生，那么第一堂课/身份证应该是学生1。如果代码中有学生，则应根据最后一个学号将其增加1。知道如何做到这一点？

Answer 1

试试这个：

$(function(){
    $("#add-new-student").click(function() {
        var studentList = $("ul#student-list");
        var currentCount = $("li", studentList).length + 1;
    studentList.append('<li class="student' + currentCount +'">Student</li>');
    $("div#student-courses").append('<div id="student' + currentCount +'" class="student-information">'
    + '<div id="student' + currentCount +'-enrolled-courses">'
    + '<span class="english">English</span>'
    + '<span class="technology">Technology</span>'
    + '</div>'
    + '</div>'
    );
    });
});

工作示例@：http://jsfiddle.net/KHfyY/5/

Answer 2

更新

http://jsfiddle.net/KHfyY/7/

喜欢这个吗？

根据您在开始时拥有的学生数量，提前设置变量n。

在此示例中，n是通过计算列表中已存在的学生自动计算的。

使用jQuery在附加的div上动态添加1到id / class

2 个答案: