我已经创建了自己的jQuery插件,但是当我尝试从表单生成查询字符串时,它存在表单中找不到的值。在此测试http://jsfiddle.net/z3Yff/3/。
(function($) {
$.fn.ajaxSubmit = function( options ) {
// Plugin settings
var settings = {
beforeFunction : function() {},
afterFunction : function() {}
};
// Override options
if ( options ) {
$.extend( settings, options );
}
// Set variables
var self = this;
// Check that form value is set
var checkValue = function(value) {
if(value != undefined && value != null)
{
return true;
}
return false;
};
// Catch submitting input/button
var submitInputName;
$("button, input[type=submit]", this).live("click", function() {
submitInputName = $(this).attr("name");
});
// Submit form
var submitForm = function(form) {
var method = form.attr("method");
if(!checkValue(method) || method.length == 0) method = "post";
var action = form.attr("action");
var query = "";
var i = 0;
$("input, button, textarea", $(this)).each(function(index) {
var name = $(this).attr("name");
var value = $(this).attr("value");
var type = $(this).attr("type");
if(checkValue(value) && checkValue(name))
{
if(i > 0)
{
query = query + "&";
}
query = query + name + "=" + value;
i++;
}
});
alert(query); // This is empty String, but it should contain values I enterd to form
return $.ajax({
type: method,
cache: false,
url: action,
data: query,
async: false
}).responseText;
};
// Add ajax submit catching
this.submit(function() {
options.beforeFunction();
submitForm($(this));
options.afterFunction();
return false;
});
};
})(jQuery);
答案 0 :(得分:1)
您的问题出在您的checkValue
功能中。这个条件总是错误的:
if(value != undefined && value != null && name != undefined && name != null)
因为你没有将name
传递给函数;以上在逻辑上等同于:
var name;
if(value != undefined && value != null && name != undefined && name != null)
就像样式注释一样,你可以把它写成:
function checkValue(value) {
return typeof value != 'undefined' && value != null;
}
JavaScript中没有特殊的undefined
值或关键字。当您说x != undefined
时,您实际上隐含地创建了一个名为undefined
且未初始化的变量,因此typeof value != 'undefined'
代替您的value != undefined
。
还有其他问题。首先,您正在跳过<select>
元素。另一方面,您没有检查type
个<input>
元素,因此您将包含表单中但未选中的复选框和单选按钮的值。
此外,您在.each
中使用了错误的内容,而不是$(form)
,而不是$(this)
所以:
$("input, button, textarea", $(this)).each(function(index) {
应该是这样的:
$("input, button, textarea", $(form)).each(function(index) {
我没有解决<select>
,单选按钮或复选框问题,但此版本至少会生成一个查询字符串:http://jsfiddle.net/ambiguous/8QYWH/