JQuery WEB 表单工具插件 TinyForm

简介

TinyForm是一个基于 JQuery 的WEB表单处理工具 ，仅操作表单，不。使用这个工具，不会改变原有的DOM结构和样式，也不会新增或移除元素。 他根据传入的选择器或DOM/jQuery对象，创建表单实例，然后在这个范围内搜索带有name属性的表单字段。

插件主要功能：

通过一个接口读取表单的指定(或全部)字段的值

通过一个接口写入表单的指定(或全部)字段的值

通过一个接口重置表单的指定(或全部)字段的值

对字段进行校验

对表单数据进行暂存，下次打开浏览器可以再次读取

使用

1.  根据情况引入相关文件

2.  HTML

<form id="foo" method="post" action="/foo/bar">
  <input type="text" name="name" value="hyjiacan" data-rule="required" />
  <input type="text" name="age" value="16" />
</form>

3.  调用

<script>
  var form = new TinyForm('#foo')
  
  // 读取所有字段的值
  var data = form.getData() // {name: 'hyjiacan', age: '16'}
  
  // 读取字段 name 的值
  var name = form.getData('name')
  
  // 'hyjiacan'
  // 设置所有字段的值
  form.setData({ name: 'Korra',  age: 21 })
  
  // 设置字段 name 的值
  form.setData('Korra', 'name')
  
  // 校验输入
  var result = form.validate()
  
  // 提交表单
  form.submit()
</script>

相关链接

Gitee 地址 ：https://gitee.com/hyjiacan/TinyForm/tree/master

中文文档 ：https://hyjiacan.oschina.io/tinyform/