我正在做一个问答应用程序。
http://jsfiddle.net/kaninepete/4YTA6/我如何扩展它以允许多个相同类型的问题?
我不知道让函数知道检查哪个字段。
提前感谢。
编辑我想单独检查每个答案。这是否需要为每个问题重新填写表格?
这在技术上是可行的，但可能需要相当多的清理——欢迎建设性的批评。(使HTML文件实际上有效，不要直接链接到jQuery，清理我的jQuery，等等。我还不是jQuery专家。)我走的路线是JavaScript查看所有适当的HTML并显示响应(而不是基于JavaScript数组构建HTML)
你基本上可以复制粘贴<li>...</li>的东西，并改变q-和a-后面的数字为每个问题，它将工作。
理想情况下，我们将使用服务器端编程来验证答案(因为客户端可以很容易地查看答案)
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js" ></script>
</head>
<body>
<form name="myform" id="myform">
<p>Make each of the following possessive by adding the appropriate apostrophe where needed. </p>
<ol type="1">
<li>boys:
<input type="text" name="q-1" /><!-- field for user input -->
<input type="hidden" name="a-1" value="boy's" /><!-- answer -->
</li>
<li>girls:
<input type="text" name="q-2" />
<input type="hidden" name="a-2" value="girl's" />
</li>
</ol>
<p><input type="button" id="validate-btn" value="Check" /></p>
</form>
<script type="text/javascript">
$('document').ready( function() {
$('#validate-btn').click( function() {
$(this).css('display','none');
$('[name|="q"]').each( function() {
// find the associated answer
var pattern = /q-([0-9]+)/; // regular expression to pull question/answer number from field name
var result = pattern.exec($(this).attr('name'))[1]; // get the question/answer number
// you could probably just navigate around with DOM to get the next hidden text field instead, eh.
// get reference to the input with the answer
var answerbox = $('[name="a-'+result+'"]');
$(this).attr('disabled',true);
// verify answer, display replacement text
if($(this).val() == answerbox.val()) {
$(this).replaceWith(' <strong>Correct!</strong>');
} else {
$(this).replaceWith(' <strong>Incorrect! The answer was "'+ answerbox.val() +'"</strong>');
}
});
});
});
</script>
</body>
是的，您需要为您希望用户回答的每个问题添加一个新的<input>元素。