详谈表单格式化插件jquery.serializeJSON

<input type="text" name="str:string" value="str"/>
<input type="text" name="number:number" value="5"/>
</form>

$('form').serializeJSON({
 customTypes: {
  alwaysBoo: function(str) { // value is always a string
   return "boo";
  },
  string: function(str) { // all strings will now end with " override"
   return str + " override";
  }
 }
});
// returns =>
{
 "scary": "boo",    // <-- parsed with type :alwaysBoo
 "str": "str override", // <-- parsed with new type :string (instead of the default)
 "number": 5,      // <-- the default :number still works
}

忽略空表单字段

// Select only imputs that have a non-empty value
$('form :input[value!=""]').serializeJSON();
// Or filter them from the form
obj = $('form').find('input').not('[value=""]').serializeJSON();
// For more complicated filtering, you can use a function
obj = $form.find(':input').filter(function () {
     return $.trim(this.value).length > 0
   }).serializeJSON();

使用整数keys作为数组的顺序

使用useIntKeyAsArrayIndex配置

<form>
 <input type="text" name="arr[0]" value="foo"/>
 <input type="text" name="arr[1]" value="var"/>
 <input type="text" name="arr[5]" value="inn"/>
</form>

按照默认的方法，结果为：

$('form').serializeJSON();
// returns =>
{'arr': {'0': 'foo', '1': 'var', '5': 'inn' }}
 

使用useIntKeyAsArrayIndex可以将记过转换为数组并制定顺序

$('form').serializeJSON({useIntKeysAsArrayIndex: true});
// returns =>
{'arr': ['foo', 'var', undefined, undefined, undefined, 'inn']}

默认配置Defaults

所有的默认配置均定义在 $.serializeJSON.defaultOptions，可以进行修改。

$.serializeJSON.defaultOptions.parseAll = true; // parse booleans, numbers and nulls by default
$('form').serializeJSON(); // No options => then use $.serializeJSON.defaultOptions
// returns =>
{
 "bool": {
  "true": true,
  "false": false,
 }
 "number": {
  "0": 0,
  "1": 1,
  "2.2": 2.2,
  "-2.25": -2.25,
 }
 "null": null,
 "string": "text is always string",
 "empty": ""
}

总结

这个插件支持的配置非常丰富，自定义程度很高，带来很大的便捷性。

以上这篇详谈表单格式化插件jquery.serializeJSON就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持软件开发网。