基本上,我正在尝试创建一个获取用户输入的表,并检查答案是否正确。
我希望它根据用户的回答将第4列更改为正确或不正确。
以下是我的尝试:
<form name="input" action="javascript:void(0);" method="get">
<table id="compsci-table" style = "margin: auto;">
<tr>
<th>Microsoft Office</th>
<th>Example</th>
<th>Extension</th>
<th>Feedback</th>
</tr>
<tr>
<td>Word Processing</td>
<td>Word</td>
<td>
<form id="form1" method="" action="" onsubmit="return validateAns(wpExtension)">
<input type="text" name="wpExtension">
<input type="submit" name="b1" value="Check" class="submitbutton aligncenter"/>
</form>
<script>
function validateAns(Ans) {
if(Ans == "docx")
alert("Correct!");
$("#formA").submit(function() {
$("#reveal-space1").text("Correct").show();
return true;
});
else
alert("Incorrect.");
$("#formA").submit(function() {
$("#reveal-space1").text("Incorrect").show();
return true;
});
</script>
</td>
<td>
<form id="formA" action="javascript:void(0);">
<div id="reveal-space1">
</div>
</form>
</td>
</tr>
<tr>
<td>Spreadsheet</td>
<td>
<form id="form2" method="" action="" onsubmit="return validateAns(ssExample)">
<input type="text" name="ssExample">
<input type="submit" name="b1" value="Check" class="submitbutton aligncenter"/>
</form>
<script>
function validateAns(Ans) {
if(Ans == "Excel")
alert("Correct!");
$("#formA").submit(function() {
$("#reveal-space2").text("Correct").show();
return true;
});
else
alert("Incorrect.");
$("#formA").submit(function() {
$("#reveal-space2").text("Incorrect").show();
return true;
});
</script>
</td>
<td>xlsx</td>
<td>
<form id="formB" action="javascript:void(0);">
<div id="reveal-space2">
</div>
</form>
</td>
</tr>
非常感谢任何正确方向的指导。
答案 0 :(得分:0)
您的代码中存在一些问题:
<form>
不应该在另一个<form>
内,它不是有效的HTML,而且您不需要那么多表单... id
在html中是唯一的,不要使用相同的id
两次name
例如wpExtension
指的是元素,而不是它的值。使用wpExtension.value
代替{}
有多条行以下是清理完代码后的工作演示:http://jsfiddle.net/VbCnu/4/
请看一下,看看你是否能弄明白:)