zepto源码分析之form表单处理

本篇是zepto源码分析系列第二篇，这里依旧有一份包含详细中文注释的zepto源代码，有需要的可以下载下来学习，觉得有帮助的话戳一颗星那就更好了

本篇会解析zepto源码中的form表单处理部分，这部分相对来说比较简单，仅包含三个方法：serialize，serializeArray，submit，依次分析如下

serializeArray

$.fn.serializeArray = function () {
            var name, type, result = [],
                //序列化后添加到数组中
                add = function (value) {
                    if (value.forEach) return value.forEach(add)//对于集合元素，递归调用
                    result.push({name: name, value: value})
                }
            if (this[0]) $.each(this[0].elements, function (_, field) {
                type = field.type, name = field.name
                //去除不需要序列化值的元素
                if (name && field.nodeName.toLowerCase() != 'fieldset' &&
                    !field.disabled && type != 'submit' && type != 'reset' && type != 'button' && type != 'file' &&
                    ((type != 'radio' && type != 'checkbox') || field.checked))
                    add($(field).val())//序列化
            })
            return result
        }

这个方法的作用是将用作提交的表单元素的值编译成拥有name和value对象组成的数组，主要内容就是一个遍历，将fieldset，submit，reset等组件类型剔除掉之后，执行$('form').serializeArray()之后会将form表单中的每一个项拿出来，执行add方法，嗯。。。比较简单，注释都有

serialize

$.fn.serialize = function () {
            var result = []
            //序列化表单元素
            this.serializeArray().forEach(function (elm) {
                //序列化后的元素进行编码
                result.push(encodeURIComponent(elm.name) + '=' + encodeURIComponent(elm.value))
            })
            //拼接字符串
            return result.join('&')
        }

serialize方法是对serializeArray的进一步封装，所做的是就是将serializeArray执行后产生的数组编码后拼接成字符串，编译成 URL编码的 字符串。

submit

$.fn.submit = function (callback) {
            if (0 in arguments) this.bind('submit', callback)//传入回调函数时，为submit绑定默认事件
            else if (this.length) {
                var event = $.Event('submit')
                this.eq(0).trigger(event)//触发一个submit事件
                if (!event.isDefaultPrevented()) this.get(0).submit()//执行submit操作
            }
            return this
        }

submit方法，一贯的尿性，实现两种功能，当传入回调函数时，会给当前的组件绑定一个submit事件，如果不传入参数，则会对当前的组件，一般是form，模拟发出一个submit事件，同时，对当前表当执行submit操作。