码迷,mamicode.com
首页 > Web开发 > 详细

js实现表单序列化的两种方法。

时间:2016-12-07 13:30:19      阅读:126      评论:0      收藏:0      [点我收藏+]

标签:options   form   for   var   循环   pair   submit   nts   new   

 

function serialize(form) {
    var parts = [],
            elems = form.elements,
            i = 0,
            len = elems.length,
            filed = null;
    for (; i < len; i++) {
        filed = elems[i];
        switch (filed.type) {
            case "select-one":
            case "select-multiple":
                if (filed.name.length) {
                    var j = 0,
                            opt,
                            optLen = filed.options.length;
                    for (; j < optLen; j++) {
                        opt = filed.options[j];
                        if (opt.selected) {
                            parts.push(encodeURIComponent(filed.name) + "=" + encodeURIComponent(opt.value));
                        }
                    }
                }
                break;
            case undefined:
            case "submit":
            case "reset":
            case "file":
            case "button":
                break;
            case "radio":
            case "checkbox":
                if (!filed.checked) {
                    break;
                }
            default:
                if (filed.name.length && filed.value) {
                    parts.push(encodeURIComponent(filed.name) + "=" + encodeURIComponent(filed.value));
                }
        }
    }
    return parts.join("&");
}

 

 这个方法重点用了HTML5中的FormData ,还有es6中for of循环。

  function serialize(form) {
        var formData = new FormData(form),
            getValue = formData.entries(),
            parts = [];
        for (var pair of getValue) {
            parts.push(pair[0] + "=" + pair[1]);
        }
        return parts.join("&");
    }

 

js实现表单序列化的两种方法。

标签:options   form   for   var   循环   pair   submit   nts   new   

原文地址:http://www.cnblogs.com/huanlei/p/6140475.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!