Javascript 如何支持DIV验证而不是表单验证？_Javascript_Twitter Bootstrap 3

Javascript 如何支持DIV验证而不是表单验证？

javascript twitter-bootstrap-3

Javascript 如何支持DIV验证而不是表单验证？,javascript,twitter-bootstrap-3,Javascript,Twitter Bootstrap 3,我真的很喜欢bootstrap表单验证程序。我想对它进行更改，以便它能够验证div标记，而不仅仅是表单例如，它的工作原理如下： <form data-toggle="validator" role="form"> ... </form> 致：我也改变了： // VALIDATOR DATA-API // ================== $(window).on('load', function () { $('form[data-toggle="

我真的很喜欢bootstrap表单验证程序。我想对它进行更改，以便它能够验证div标记，而不仅仅是表单

例如，它的工作原理如下：

<form data-toggle="validator" role="form">
    ...
</form>

致：

我也改变了：

// VALIDATOR DATA-API
// ==================

$(window).on('load', function () {
  $('form[data-toggle="validator"]').each(function () {
    var $form = $(this)
    Plugin.call($form, $form.data())
  })
})

致：

仍然不能像原始代码一样工作。代码的其余部分似乎使用base.form控件类来查找表单元素。我不知道还能去哪里找。有什么想法吗

未经更改的原始代码：（HTML+JavaScript）：


名称
电子邮件
提交

从语义上讲，验证

div

没有任何意义。表单用于封装表单字段并提供验证和提交。你想这样做有什么原因不同于浏览器的处理方式吗？@MikeMcCaughan举例来说，你可能有一个嵌套表单，比如在sharepoint中，每个页面都有一个封闭表单，因此你所有的自定义表单都是div。从语义上讲，验证

div

没有任何意义。表单用于封装表单字段并提供验证和提交。你想这样做有什么原因不同于浏览器的处理方式吗？@MikeMcCaughan例如，在sharepoint中，你可能有一个嵌套表单，每个页面都有一个封闭表单，因此你所有的自定义表单都是div。

.filter('[form="' + this.$element.attr('id') + '"]')

.filter('[div="' + this.$element.attr('id') + '"]')

// VALIDATOR DATA-API
// ==================

$(window).on('load', function () {
  $('form[data-toggle="validator"]').each(function () {
    var $form = $(this)
    Plugin.call($form, $form.data())
  })
})

$(window).on('load', function () {
  $('div[data-toggle="validator"]').each(function () {
    var $form = $(this)
    Plugin.call($form, $form.data())
  })
})

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body> 
    <div class="container">

        <form data-toggle="validator" role="form">
            <div class="form-group">
                <label for="inputName" class="control-label">Name</label>
                <input type="text" class="form-control" id="inputName" placeholder="Cina Saffary" required>
            </div>
            <div class="form-group">
                <label for="inputEmail" class="control-label">Email</label>
                <input type="email" class="form-control" id="inputEmail" placeholder="Email" data-error="Bruh, that email address is invalid" required>
                <div class="help-block with-errors"></div>
            </div>
            <div class="form-group">
                <button type="submit" class="btn btn-primary">Submit</button>
            </div>
        </form>

    </div>

    <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/1000hz-bootstrap-validator/0.11.5/validator.js"></script>
</body>
</html>