我想在我的网站上进行调查,因为我正在设计一个php表单。表单看起来像这样。
<?php
function survey(){
?>
<script>
$(document).ready(function(){
$("intro").show();
$("q1").hide();
$("q2").hide();
$("#continue").click(function(){
$("intro").hide();
$("q1").show();
});
$("#continue1").click(function(){
$("intro").hide();
$("q1").hide();
$("q2").show();
});
$("#continue2").click(function(){
$("q2").hide();
});
});
</script>
<intro>
<p>Understanding of ...</p>
<button id="continue">Continue</button>
</intro>
<form name="survey" action="<?php echo $_SERVER['PHP_SELF'];?>" id="survey">
<q1>
<p>[Q01]A balloon ...?</p>
<input type="radio" name="q1" value="r">(a) The internal energy of the gas decreases from its initial value, but the enthalpyremains constant<br>
<input type="radio" name="q1" value="w">(b) The internal energy of the gas increases from its initial value, but the enthalpyremains constant<br>
<input type="radio" name="q1" value="w">(c) Both internal energy and enthalpy of the gas remain constant</br>
<input type="radio" name="q1" value="w">(d) Both internal energy and enthalpy of the gas increase</br>
<input type="radio" name="q1" value="w">e) Nothing can be inferred because the system is not in equilibrium</br>
<button id="continue1">Continue</button>
</q1>
<q2>
<p>[Q02] A system is ...</p>
<input type="radio" name="q2" value="w">(a) Q1 = Q2 b. W1<br>
<input type="radio" name="q2" value="w">(b) W1 + Q1 = Q2 + W2</br>
<input type="radio" name="q2" value="w">(c) W1 = W2 d. Q1</br>
<input type="radio" name="q2" value="r">(d) Q1 – W1 = Q2 – W2</br>
<button id="continue2">Continue</button>
<input type="submit" value="submit" id="submit">
</q2>
</form>
<?php
}
?>
在另一个php页面中,我调用此函数来显示此表单。
当用户加载div将显示的页面时,表格可以正常工作,当用户按下继续按钮时,div将加载它,预计会像这样继续。
但究竟发生了什么当用户按下继续按钮时,表格将按照我们的预期工作,然后用户按下继续按钮,简介将隐藏,q1将再次显示用户,按下继续按钮表单已提交而没有按下提交按钮这有什么问题以及如何解决这个问题?。
只有在按下提交按钮后才能提交表单。
答案 0 :(得分:1)
未声明<button>
的{{1}}默认为type
。您可以通过将其更改为type="submit"
type="button"
或者在您的点击处理程序中,您可以阻止默认事件
<button type="button" id="continue1">Continue</button>
我没有看到任何隐藏/显示代码是如何工作的,因为所有的jQuery选择器都是无效的。他们都在寻找不存在的标记名。
$("#continue1").click(function(evt){
evt.preventDefault();
/* other code*/
});
会匹配$("q1")
标记,而不是您在表单中的元素。你应该花一些时间在selectors section of jQuery API