jqBootstrapValidation插件不适用于我的表单

jqBootstrapValidation plugin is not working for my form

本文关键字：我的 表单 适用于 不适用 插件 jqBootstrapValidation      更新时间：2024-05-13

这是我第一次使用这个插件。我使用的是jQuery v-1.10。我也在使用迁移插件。我已经添加了js文件。我使用预印本添加了所有这些。但是插件仍然不起作用。

控制台中也没有显示错误；只有一条警告显示：

event.returnValue已弃用。请改用标准事件.prventDefault（）。

我的表单和JS代码如下所示。

<form id="login-form" method="post" action="#" novalidate>
    <label for="login-email" class="control-label">Email : </label>
    <input id="login-email" class="form-control" name="email" type="email" placeholder="Email..." required><br>
    <label for="login-password" class="control-label">Password : </label>
    <input id="login-password" class="form-control" name="password" type="password" placeholder="Password..." required><br>
    <input class="btn btn-default" name="submit" type="submit" value="Submit">
</form>
$("#login-form input").not("[type=submit]").jqBootstrapValidation();

您必须在标记中使用适当的控件才能工作。

Ex。

<form ...>
    <div class="control-group">
        <label ...>Email</label>
        <div class="controls">
            <input ... />
            <p class="help-block"></p>
        </div>
    </div>
</form>

就我个人而言，我认为处理javascript的更好方法是创建一个"经过验证"的类，因为并非所有字段都需要验证。但我认为这实际上取决于您的表单元素：您可能确实需要验证整个表单，但在我处理过的大多数表单中，只有某些元素需要验证，因此创建一个类以在javascript中调用会更好，这样jqBootstrapValidation.js就不会扫描整个表单。

Ex。

/* assigned by class */
$(function(){$(".validated").jqBootstrapValidation();});
/* assigned by element */
$(function(){$("input,select,textarea").not("[type=submit]").jqBootstrapValidation();});

然后只需将您的"已验证"类添加到您需要验证的任何内容中：

<input type="email" class="form-control validated" name="email" id="email" placeholder="Email Address" required />

希望这能有所帮助！

相关文章：