根据单选按钮选择隐藏多步骤表单中的步骤答案

【问题标题】：Hide Step from multiple step form depending on radio button selection根据单选按钮选择隐藏多步骤表单中的步骤
【发布时间】：2017-02-09 16:29:52
【问题描述】：

我从this source 成功设置了一个 4 步 php 表单。只有我在完成一项任务时遇到了问题：在第一页我插入了一个单选按钮。根据选择（“是”或“否”）应跳过第 3 步。

我已经尝试了 2 个小时并搜索了互联网 - Java Script 不是我的强项。我怎样才能实现它？在我正在使用的 JavaScript 下方：

<script type="text/javascript">
$(document).ready(function(){
var current = 1,current_step,next_step,steps;
steps = $("fieldset").length;
$(".next").click(function(){
if(current=='2' && $('input[name="Guest_sel"]:checked').val()=='No') {
/* HERE I DON'T KNOW WHAT TO PUT. THE ALERT COMES AT THE RIGHT POINT AFTER STEP 2 IF I SELECTED "NO" FOR "Guest_sel". */
alert("Test");
}
current_step = $(this).parent();
next_step = $(this).parent().next();
next_step.show();
current_step.hide();
setProgressBar(++current);
});
$(".previous").click(function(){
current_step = $(this).parent();
next_step = $(this).parent().prev();
next_step.show();
current_step.hide();
setProgressBar(--current);
});
setProgressBar(current);
// Change progress bar action
function setProgressBar(curStep){
var percent = parseFloat(100 / steps) * curStep;
percent = percent.toFixed();
$(".progress-bar")
.css("width",percent+"%")
.html(percent+"%");     
}
});
</script>

在第 6 行中，我已经设置了正确的 if 语句 (if(current=='2' && $('input[name="Guest_sel"]:checked').val()=='No' ))。但是我必须在 if 语句中放入什么？

我的想法是所有步骤都应该有一个从 1 到 4 的数字。例如，如果 current_step = $(this).parent() 为“1”，则 next_step 应为“2”，依此类推。所以我在 if 语句中尝试了 current_step = $(this).parent() + 1; 和类似的东西，但都没有奏效。我还尝试在警报中输出上述任何变量以了解其中存储的内容，但只有“未定义”变量。 JavaScript 让我发疯。 :-(

如果单选按钮“Guest_sel”=“否”，任何想法在 if 语句中放置什么以使其跳过第 3 步？非常感谢你们！

【问题讨论】：

this = $(this).parent().next(); 将它添加到括号内，这应该让它相信它在第 3 步，所以它会显示第 4 步而不是第 3 步
感谢 LordNeo！不幸的是，这使得整个事情不再起作用。这很奇怪，我以前也经历过：如果我将该行插入 if 语句 - 即使条件不是肯定的（没有选择或选择“是”），整个事情也不再起作用了。甚至无法从第 1 步继续到第 2 步。无论如何。不知道为什么？
尝试将您的代码放入 sn-p 或 jsfiddle 或 codepen 中，以便我们更好地调试它。同样，控制台应该会给你一些关于它的错误。
控制台说 ReferenceError: invalid assignment left-hand side。将尝试 JSFiddle/Codepen 并再次发布，但从未这样做过。感谢您的建议！
刚刚创建了一个jsfiddle：jsfiddle.net/gkxvLs9u/2

标签： javascript forms multi-step

【解决方案1】：

好的，我想通了。花了我一段时间，但感谢 JSFiddle 的提示。工作文件在这里：http://jsfiddle.net/gkxvLs9u/3/

next_step = $(this).parent().next().next() 成功了：

$(".next").click(function(){
current_step = $(this).parent();
if(current=='2' && $('input[name="Guest_sel"]:checked').val()=='No') {
next_step = $(this).parent().next().next();
++current;
} else {
next_step = $(this).parent().next();
}
next_step.show();
current_step.hide();
setProgressBar(++current);
});

【讨论】：