尝试从 jQuery 表单获取多个字段时遇到一些问题。
我使用表单来创建项目。任务的数量没有预定义,因此可以通过 jQuery 动态创建用于添加新任务的新表单字段:
HTML 表格
<form action="#" id="createProjectForm" method="post">
<fieldset id="Project">
<label for="title">Title:</label>
<label for="title">Coordinator:</label>
<input type="text" id="coordinator" name="coordinator" placeholder="COORDINATOR" />
<div id="tasks">
<hr/>
<label for="taskTitle">Task:</label>
<input type="text" id="taskTitle" name="taskTitle" placeholder="TASK TITLE" />
</div>
<label for="createTask"></label>
<input type="button" id="createTask" value="ADD NEW TASK" />
<label for="submitTask"></label>
<input type="submit" id="submitTask" value="SAVE AND CREATE PROJECT" />
</form>
查询
$("#createTask").live("click",function() {
$('#tasks').clone().insertAfter("#tasks");
});
当我克隆 div“任务”时,我可以正确地看到新任务的两个“taskTitle”输入字段,但是在尝试获取值时(使用“每个”):
查询
$("#createProjectForm").live("submit",function() {
var taskTitles = "";
$("#taskTitle").each(function(){
taskTitles += $.trim($(this).val()) + ",";
console.log("Task: "+taskTitles);
});
我只得到第一个字段的值,而不是第二个字段的值,就像它没有正确存储在 DOM 中一样......
有什么建议吗?谢谢!