2

我确信有更好的方法来实现这一点，但无法弄清楚。我有一个表格，顶部有 2 个始终需要的字段。然后，我有一系列选项卡，它们在选择时加载到不同的字段中（加载单独的 HTML 块，以便在提交表单时只提交当前在 DOM 中的内容）。我正在使用 jquery 验证插件（http://docs.jquery.com/Plugins/Validation），它允许您在每组新字段加载时将验证规则/消息设置为一个对象，以删除冗余规则和随着字段的变化添加新的。问题是规则/消息对象都必须写入 js 以供需要时使用，而且文件很长，而且看起来效率很低。这是我的伪代码：

<form>
    <input1 (always on page) />
    <input2 (always on page) />
    <ul id="nav-tabs">
        <li id="tab1"></li>
        <li id="tab2"></li>
        <li id="tab3"></li>
    </ul>
    <div id="dynamic-content">
        <!-- different form fields load in here from separate html files, all requiring different rules in addition to the 2 fields always on the page -->
    </div>
    <input type="submit" />
</form>

我在想可能有一些解决方案可以在设置的每个 HTML 块中加载规则？有没有人做过这样的事情？

感谢任何能提供帮助的人。吨

4

4 回答 4

4

使用内置rules()方法添加规则。 请参阅文档。

注意：调用后必须调用该方法。.validate()

jsFiddle 演示

$("#form").validate({
    // my other options
});

// the following method must come AFTER .validate()

$(".myClass").each(function() {
    $(this).rules('add', {
        required: true,
        minlength: 5
    });
});

以下与 custom 结合使用messages:。请注意，格式与将规则添加为选项时略有不同.validate()...

$(".myClass").each(function() {
    $(this).rules('add', {
        required: true,
        minlength: 5,
        messages: {
            required: "Required input",
            minlength: jQuery.format("At least {0} characters are necessary")
        }
    });
});

当您向表单动态添加字段时，此方法也非常有用。

var myRule = {
    required: true,
    minlength: 5,
    messages: {
        required: "Required input",
        minlength: jQuery.format("At least {0} characters are necessary")
    }
}

$("#myform").append('<input type="text" name="four" /><br />');
$("[name='four']").rules('add', myRule);

jsFiddle 演示：

http://jsfiddle.net/kSFKE/10/

remove如果您要动态销毁不需要的字段输入，则无需使用删除规则。

于 2013-01-02T18:55:39.973 回答
0

如果它只是您需要的简单验证，您可以使用class每个属性input来验证它。

HTML

<input type="text" name="input1" class="required" />

Javascript

$("#Form").validate();

演示

于 2013-01-02T23:07:15.893 回答
0

还有一种rules()方法具有动态规则更改add的remove子方法

http://docs.jquery.com/Plugins/Validation/rules#.22add.22rules

示例（来自文档）：

$("#myinput").rules("add", {
 minlength: 2
});

许多人也没有意识到字段上的类的简单性。

对于您将在规则对象中使用布尔值的简单规则，用作类的相同规则名称将自动注册该字段。您创建的任何方法也是如此。

您还可以考虑data-在添加/删除元素时使用属性来帮助修改规则。可以循环遍历新元素或旧元素并使用data-属性解析到rules()方法中

于 2013-01-02T04:23:48.607 回答
-1

有人问如何动态应用规则；

    <?php
    $form_rules = array(
    'user_login' => array(
    'required' => true,
    'minlength' => 4)
    );
    ?>

然后在页面的头部

    <script>
        $(document).ready(function() {
            $('#portal_reg').validate({ // form id 
                'rules': <?php echo json_encode($form_rules); ?>
            });
        });
    </script>
于 2014-06-30T03:15:28.433 回答