1

我有一个非常大的表格，由大约 40 个问题组成。我将问题分成几部分，每部分 10 个，每个部分都包含在一个 div 中。

我正在使用 jQuery 将 div 滑入和滑出

 $('a.nextform').click(function(e){  
       $('.hold-all').animate({"left": "-=690"}, 500);
        e.preventDefault();
    })
 $('a.backform').click(function(e){  
       $('.hold-all').animate({"left": "+=690"}, 500);
       e.preventDefault();
    })

我想以某种方式说，如果要求的字段已经完成，不允许用户单击下一步，这可能与 jQuery 吗？

4

5 回答 5

0

给输入一个id，例如<input id='name' type='text'/>

然后检查它是否为空使用

$('#name').val()

例子

if($('#name').val() != ''){
//do
}
else
{
//dont do
}
于 2012-05-01T09:59:50.660 回答
0

您可以使用 JQuery 在按钮输入上设置属性 disabled="disabled"：参见 w3schools例如$(button).attr('disabled', 'disabled')。您还可以将处理程序放在$(form).submit和 preventDefault 上并返回 false。您还可以return false在上面的单击处理程序上执行操作，以防止执行更多的单击代码。

于 2012-05-01T09:59:58.720 回答
0

您可能还想将验证分解为多个阶段，即在输入全部在当前 div 上验证之前不要移动到下一个 div。

您可以使用各种用于 jquery 表单验证的插件，您可以从http://docs.jquery.com/Plugins/Validation开始。

然后您可以使用 .valid() 来检查是继续前进还是显示错误，这是一个简单粗略的示例：

$('a.nextform').click(function(e){ 
if ("#myform").valid()) {
$('.hold-all').animate({"left": "-=690"}, 500);
    e.preventDefault();
}
}
...
于 2012-05-01T10:00:45.070 回答
0

当然。遍历每个输入字段 - 您可以使用字段集对它们进行分组并使用类似 .children('input, textarea') 的东西 - 检查每个输入并验证给定输入是否有值。

于 2012-05-01T10:01:23.243 回答
0

如果您为所有表单字段手动编写此代码，那将是疯狂且难以维护的。在列表中添加或删除字段很快就会使该过程难以维护、管理和跟踪。

您面临的问题是一个常见问题，也是一个已解决的问题：“验证”

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

基本上将css类“必需”添加到任何必填字段。调用在表单或表单容器上运行验证插件。

当用户单击 Next 调用 $("form#questions").validate()

如果 validate 返回 true，则将下一个 div 滑入。如果返回 false，则不要。验证插件还可以在验证失败的字段末尾添加验证消息，和/或提供失败约束的验证摘要消息：有关更多详细信息，请参阅文档。

http://jquery.bassistance.de/validate/demo/

于 2012-05-01T10:04:54.287 回答