Parsley.js 可以在没有表单元素的情况下工作吗？答案

【问题标题】：Can Parsley.js work without form element?Parsley.js 可以在没有表单元素的情况下工作吗？
【发布时间】：2014-02-19 14:51:35
【问题描述】：

<form id="f">
    <div class="form-group">
        <label for="exampleInputEmail1">Email address</label>
        <input parsley-type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email" parsley-trigger="keyup">
    </div>
 </form>
<script>
    $(function(){
        $('#f').parsley('validate');
    });
</script>

我想验证 div 元素中的内容而不是表单元素，可以吗？

【问题讨论】：

在文档中查找parsley-bind。

标签： validation parsley.js

【解决方案1】：

Parsley 无法验证 div / span 元素内的文本。但是您可以完美地验证不在表单标签内的输入，在您的示例中，您只需执行$('#exampleInputEmail1').parsley('validate');

【讨论】：

和 $('#exampleInputEmail1').parsley().validate() 在版本 2.x 中用于不带表单标签的单个字段验证

【解决方案2】：

我已经能够（ab）使用优秀的 Parsley 验证器来处理像这样的非输入元素，

var inputField = $J('<input id="someRandomID" type="text" data-parsley-type="alphanum" data-parsley-required="true" >');
var parsleyHandle = inputField.parsley();
inputField.val('wronginput!@#!#!@#');
console.log(parsleyHandle.isValid()); // should be false

inputField.val('correctinput');
console.log(parsleyHandle.isValid()); // should be true

显然，值的来源可以是任何东西 - div、span 等。

祝你好运

【讨论】：

【解决方案3】：

我遇到了类似的问题。在 SharePoint 2013 中（至少在可视 Web 部件中）直接在标记中添加表单会导致问题。 SP 将通过添加大量生成的标记来“形成”它并改变外观。虽然可能有一种方法可以解决那个问题，但我想快速将 Parsley 添加到具有许多输入的表中，而不是玩弄 SP 生成的表单。我的解决方案是在呈现 UI 后使用 jQuery $.wrap()。奇迹般有效。是的，它仍然使用表单元素，但也许您出于类似原因避免使用表单。试试这个JSFiddle

<div id='container'>
  <button type="button" id="save">Save</button>
  <table>
    <tr>
        <td><input type='number' min='0' max='999' /></td>
        ... many more inputs
   </tr>
   ...
  </table>
</div>
<script ... >
$(document).ready(function(){

     $("#container").wrap("<form id='fooForm'></form>");

     var options = {
         uiEnabled: true,
         errorsWrapper: '',
         excluded: '.inActive'
     };

     // create the validator
     $("#fooForm").parsley(options);

     // wire up click event for the save button
     $("#save").click(function () {

         // react to form valid state
         // calling parsley again only returns the
         // ref to the original, does not duplicate
         var validator = $("#fooForm").parsley();

         validator.validate();

         // handle validator.isValid();           
         // ajax form post or other

     });
});

</script>

【讨论】：

谢谢它和我一起工作:) 这解决了我 ASPX .NET 不接受两个嵌套表单并删除内部表单的问题