多步骤表单验证[关闭]答案

【问题标题】：Multi step form validation [closed]多步骤表单验证[关闭]
【发布时间】：2013-08-27 23:11:03
【问题描述】：

我是 jQuery 新手，我不知道如何在我下载的 jQuery 表单上实现一些 jQuery 验证。

我正在使用这个表格：http://thecodeplayer.com/walkthrough/jquery-multi-step-form-with-progress-bar

服务器端验证已经在 php 中完成，但我需要 jQuery，这样如果用户没有在这些字段上写任何内容，他们就无法单击下一步按钮。（与输入标签所需的 html 属性相同）

我通过复制和粘贴其他人的 jQuery 验证代码尝试了各种方法，但都没有成功。因此，如果有人能在这个问题上帮助我，我将不胜感激（因为我是 linux 管理员，所以会给你买一只企鹅 =p）

亲切的问候，西普里安

【问题讨论】：

请向我们展示一些您已经拥有的代码。然后我们知道您已经尝试过什么。您可以在此处发布代码：jsfiddle.net
所以您已经从其他人那里复制和粘贴，并且无法找到您在做什么的线索，所以即使复制和粘贴，您也需要请其他人帮助您。是的。正确的。欢迎来到 Stackoverflow，这是复制粘贴问答的绝佳平台。
@Raffael：感谢您的建议和回复。这是我的小提琴jsfiddle.net/ANWXy

标签： php javascript jquery html validation

【解决方案1】：

首先，您需要包含一个验证插件。 Here's 一个非常好的。

然后您需要将required 标签添加到所有需要的输入中。

然后，当用户单击“下一步”按钮时，您需要像这样验证表单。

$('#msform').validate();
if (!$('#msform').valid()) {
    return false;
}

将上面的代码放在$(".next").click(function(){之后，你就可以设置好了。

我已经构建了此代码here 的工作副本。第一张幻灯片上的输入是必需的。然后在下一张幻灯片上，需要第一个输入。

请注意，此项目需要三个 JavaScript 文件：

<script type="text/javascript" src="http://thecodeplayer.com/uploads/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="http://thecodeplayer.com/uploads/js/jquery.easing.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>

【讨论】：

你好，格雷厄姆，谢谢你的代码就像一个魅力。