我正在做一个使用 jquery 的简单 PHP 测验应用程序,规则是:
- 每个测验有很多问题(最多 100 个),用户单击以添加更多问题,这会生成一个新表单,附加在列表末尾
- 每个问题有很多答案(最多 5 个),用户点击为一个问题添加更多答案,附加在该问题的答案列表的末尾
- 问题按提交顺序排序/加权,在这种情况下是 ajax post
- 答案被命名为“答案[]”
- 从数据库加载的测验,用户可以在上述限制内删除、编辑或添加新的问题/答案
我决定用“class='postable'”将每个问题组织成一个表格。我的测验更新脚本如下所示
$("#update-change").click(function(e){
e.preventDefault();
showupdate('Updating..');
$('form.postable').each(function(){
$.ajax({
type: "POST",
url: 'update_ask.php',
data: $(this).serialize()
}).done(function( msg ) {
feedbackMessage(msg);
});
});
});
因此,每次“#update-change”命中时,都会有 n 个 ajax 发布到“update_ask.php”以保存测验内容。问题是问题不会被排序为看到,它可能是'update_ask.php'由于滞后而无法按顺序处理ajax请求。
您对此案有任何想法/解决方案吗?请指教。谢谢。
一个问题集的 HTML 如下所示:
<form action="update_ask.html" method="post" accept-charset="utf-8" name="aj_edit_ask2430" id="editaskform2430" class="postable">
<input type="hidden" name="idask" value="2430" />
<input type="hidden" name="idquiz" value="240" />
<div class="ask-holder">
<textarea name="ask" class="ask" tabindex="24300" placeholder="Question">cau 5</textarea>
<div class="right answer-image-holder"><img src="no-image.jpg" id="askimg2430" class="answerimg" alt="image" />
<input type="hidden" name="askimg" id="saskimg2430" value="" />
</div>
</div>
<div id="solution2430" class="answer-holder">
<div id="answer30684" class="answer-row">
<textarea name="answer[]" class="answer" tabindex="24301" placeholder="Answer or Solution">answer 51</textarea>
<div class="right answer-image-holder"> <img src="no-image.jpg" id="img30684" class="answerimg" alt="image" />
<input type="hidden" name="images[]" id="simg30684" value="" />
</div>
<span>
<input type="radio" name="iscorrect" value="1" checked='checked' />
Correct <a href="#row2430" onclick="removeAnswer('30684')" title="Remove this solution" class="removeanswer">Delete</a></span>
</div>
<div id="answer30685" class="answer-row">
<textarea name="answer[]" class="answer" tabindex="24302" placeholder="Answer or Solution">answer 52</textarea>
<div class="right answer-image-holder"> <img src="no-image.jpg" id="img30685" class="answerimg" alt="image" />
<input type="hidden" name="images[]" id="simg30685" value="" />
</div>
<span>
<input type="radio" name="iscorrect" value="2" />
Correct <a href="#row2430" onclick="removeAnswer('30685')" title="Remove this solution" class="removeanswer">Delete</a></span>
</div>
<div id="answer30686" class="answer-row">
<textarea name="answer[]" class="answer" tabindex="24303" placeholder="Answer or Solution">answer 53</textarea>
<div class="right answer-image-holder"> <img src="no-image.jpg" id="img30686" class="answerimg" alt="image" />
<input type="hidden" name="images[]" id="simg30686" value="" />
</div>
<span>
<input type="radio" name="iscorrect" value="3" />
Correct <a href="#row2430" onclick="removeAnswer('30686')" title="Remove this solution" class="removeanswer">Delete</a></span>
</div>
</div>
<a href="#row2430" onclick="return addSolution('2430')" title="Add one more solution">Add</a> <a href="#row2430" onclick="return removeAsk('2430','order2430')" title="Completely Delete this question">Delete this question</a>
</form>