以重力形式动态显示“下一步”或“提交”

Question

我正在创建一个带有条件逻辑的表单： 选项1：用户将只输入其基本信息。 选项2：如果他们选择一个复选框，那么除了基本信息外，他们还会填写一系列问题。 我希望将选项2中提出的所有问题都放在表格的第二页上，只显示相应的内容。所有这些工作，问题是“提交”按钮在第二页而不是第一页，因此在选项1中用户没有看到“提交”按钮只有“下一步”按钮。 [下一个将提交表单，但我关心的是按钮的文本和样式]。我需要提交按钮上的条件逻辑，所以如果选择选项1，按钮将显示一个提交按钮，如果他们选择选项2，它将显示下一个按钮。

Answer 1

基于复选框状态，您可以更改按钮的文本（它的值）。
由于您没有显示任何代码，下面是一个简单的例子。

$("#more").on("click",function(){ 
 
\t if ($(this).prop("checked")){ 
 
\t \t $("#next").val("Next"); 
 
\t }else{ 
 
\t \t $("#next").val("Submit"); 
 
\t } 
 
}); 
 

 
$("#next").on("click",function(){ 
 
\t if($(this).val() == "Submit"){ 
 
\t \t alert("Submit the form now."); 
 
\t }else{ 
 
\t \t alert("Ask the other questions."); 
 
\t } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" id="more"> Check to answer additionnal question<br> 
 
<br> 
 
<input type="button" id="next" value="Submit">