利用ajaxSubmit提交的时候，解决多个input name相同的问题

本文主要是介绍利用ajaxSubmit提交的时候，解决多个input name相同的问题，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

有时候我们在移动端提交表单的时候，为了不让submit按钮提交后，页面跳转到form action的地址，我们可能会用ajax form 插件来提交整个表单。

按钮会就这么写

<form>
<input name="test" value="test1" />
<input name="test" value="test2" />
<input name="test" value="test3" />
<button type="button">submit</button>
</form>

js部分，移动端如果用zepto的话 会这么写

$("button").on("tap",function(){$("form").ajaxSubmit({url: "https://www.goggle.com/",type:post,success:function(){alert("success!");return false; //防止页面跳转
}});
});

如果用zepto 的 ajax form插件提交整个表单的话，含有相同name 的input 提交到服务器后，最后一个往往会覆盖前面所有的，服务器端接收的时候，只能看到最后一个value值。

通过查看zepto.form.min.js 这个插件的源码的时候发现里面这段js

items.each(function(index) {params[this.name] = this.value；});

这个直接把所有相同的属性的值给覆盖掉了，为了达到目的，能上传多个相同name的input的值，我在这里进行了一点点小的改动，成功可以提交了

items.each(function(index) {if (params[this.name] == undefined) {params[this.name] = this.value} else {params[this.name] += "," + this.value}});

特地查看了一下jquery 的ajax form插件，发现这个是完好的，所以如果有小伙伴用到了 zepto.form.min.js这个插件的时候，并且需要提交多个name相同的input的时候可以用以上办法解决。附上完整的zepto.form.min.js的代码，自行拷贝后，压缩一下就能直接调用。

(function($) {$.fn.ajaxSubmit = function(options) {var form = this;var formAction = form.attr("action");var formMethod = form.attr("method");if (formMethod == null || !/^(POST|GET)$/i.test(formMethod.trim())) {formMethod = "GET"}var params = new Object();var items = form.find("input[type=hidden]," + "input[type=text]," + "input[type=password]," + "textarea," + "select," + "input[type=radio]:checked," + "input[type=checkbox]:checked");items.each(function(index) {if (params[this.name] == undefined) {params[this.name] = this.value} else {params[this.name] += "," + this.value}});var dataType = options.dataType;if (dataType == null) {dataType = "json"}var success = options.success;if (success == null) {success = function() {}}$.ajax({type: formMethod,url: formAction,data: params,dataType: dataType,success: success})}
})(Zepto);

这篇关于利用ajaxSubmit提交的时候，解决多个input name相同的问题的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---