我希望在没有刷新代码的情况下插入到数据库中，我也希望重置表单以及使用javascript的实时过滤器，当我使用此代码时，它不起作用，并打开新的黑页sucms.php但插入数据库，什么谁有人能告诉我错了？ 当我提交此表单时，它_target新页面的sucms.php，有什么问题？
function fsocietyApp() {
var img = document.getElementById('uploadphoto');
var fup = img.value;
var error = document.getElementById('fsoc');
var ex = fup.substring(fup.lastIndexOf('.') + 1).toLowerCase();
var website = document.getElementById('website');
var webUrl = document.getElementById('webUrl');
var re = /^(http[s]?:\/\/){0,1}(www\.){0,1}[a-zA-Z0-9\.\-]+\.[a-zA-Z]{2,5}[\.]{0,1}/;
//firstname
if (fnvaluf.value.length == 0) {
fnufb.innerHTML = 'First name is required';
fnvaluf.classList.add('errorb');
return false;
} else if (/[^a-zA-Z0-9\-\/]/.test(fnvaluf.value) && fnvaluf.value.length != 0) {
fnuf.innerHTML = 'Only letters [a-z],numbers [0-9] are allowed';
fnvaluf.classList.add("error");
platform = 'off';
fnufb.innerHTML = '';
fnvaluf.classList.remove('errorb');
return false;
}
//lastname
else if (lnvaluf.value.length == 0) {
lnufb.innerHTML = 'Last name is required';
lnvaluf.classList.add('errorb');
return false;
} else if (/[^a-zA-Z0-9\-\/]/.test(lnvaluf.value) && lnvaluf.value.length > 0) {
lnuf.innerHTML = 'Only letters [a-z],numbers [0-9] are allowed';
lnvaluf.classList.add("error");
platform = 'off';
lnufb.innerHTML = '';
lnvaluf.classList.remove('errorb');
return false;
}
//username
else if (x.value.length == 0) {
y.innerHTML = "Username is required";
x.classList.add("error");
platform = 'off';
nfsoc.style.color = "white";
return false;
} else if (x.value.length < 4) {
x.classList.add("error");
platform = 'off';
nfsoc.style.color = "white";
y.innerHTML = "Use 4 characters or more";
return false;
} else if (x.value.length > 12) {
platform = 'off';
x.classList.add("error");
nfsoc.style.color = "white";
y.innerHTML = "Use 12 characters or less";
return false;
} else if (/[^a-zA-Z0-9\-\/]/.test(x.value) && x.value.length > 0) {
y.innerHTML = 'Only letters [a-z],numbers [0-9] are allowed';
x.classList.add("error");
platform = 'off';
return false;
}
//email
else if (!hashOne.test(email.value) || !hashTwo.test(email.value) || !hashThree.test(email.value)) {
emailuf.innerHTML = "Invalid E-mail address";
email.classList.add('error');
platform = 'on';
return false;
} else if (email.value.length == 0) {
emailuf.innerHTML = "E-mail is required";
email.classList.add('error');
return false;
}
//password
else if (password.value.length < 6 && password.value.length != 0) {
pswuf.innerHTML = "Use 6 characters or more";
password.classList.add('error');
return false;
} else if (password.value.length == 0) {
pswuf.innerHTML = "Password is required";
password.classList.add('error');
return false;
}
//repeat password
else if (password.value != rpassword.value && password.value.length != 0) {
rpswuf.innerHTML = "Your passwords do not match";
rpassword.classList.add('error');
platform = 'off';
return false;
} else if (password.value.length == 0 && rpassword.value.length != 0) {
rpswuf.innerHTML = "";
rpassword.classList.remove('error');
return false;
} else if (document.getElementById("uploadphoto").files.length != 0 && ex != "gif" && ex != "png" && ex != "bmp" && ex != "jpeg" && ex != "jpg") {
error.innerHTML = "<img style='position:relative;bottom:12px' src='img/red.png' alt='error'>";
return false;
} else if (website.value !== '') {
if (!re.test(website.value)) {
if (!re.test(website.value)) {
website.classList.add('error');
webUrl.innerHTML = "Invalid URL Address";
return false;
}
}
}
$(document).ready(function() {
$("#formid").submit(function(e) {
var formObj = $(this);
var formURL = formObj.attr("action");
if (window.FormData !== undefined) {
var formData = new FormData(this);
$.ajax({
url: formURL,
type: 'POST',
data: formData,
mimeType: "multipart/form-data",
contentType: false,
cache: false,
processData: false,
success: function(data, textStatus, jqXHR) {
$("#multi-msg").html('<pre><code>' + data + '</code></pre>');
$("#formid")[0].reset();
},
error: function(jqXHR, textStatus, errorThrown) {
$("#multi-msg").html('<pre><code class="prettyprint">AJAX Request Failed<br/> textStatus=' + textStatus + ', errorThrown=' + errorThrown + '</code></pre>');
}
});
e.preventDefault();
e.unbind();
}
});
});
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="formid" method="post" onsubmit="return fsocietyApp()" action="phppath/sucms.php" enctype="multipart/form-data">
<div id="form" class="f-row">
<div class="f-col s12 m12 l12">
<h2>Sign up CMS</h2>
</div>
<div class="f-col s12 m6 l6">
<!--firstname-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>First name *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="fname" name="name" type="text" placeholder="First name" onblur="fnameunFormalb()" oninput="fnameunFormal()">
</div>
<div id="fnunFormal"></div>
<div id="fnunFormalb"></div>
</div>
<!--lastname-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>Last name *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="lname" name="lname" type="text" placeholder="Last name" onblur="lnameunFormalb()" oninput="lnameunFormal()">
</div>
<div id="lnunFormal"></div>
<div id="lnunFormalb"></div>
</div>
<!--username-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6 id="theofile">Username *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="nfsoc" name="uname" type="text" placeholder="Username" onblur="usrFsoc()" oninput="usrFsoc2()" onfocus="usrColor()">
</div>
<div id="usrunFormal"></div>
</div>
<!--email-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>E-mail *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="email" type="text" name="email" placeholder="E-mail" onblur="validateEmailb()" onfocus="validateEmail()">
</div>
<div id="emailunFormal"></div>
</div>
<!--password-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>Password *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="password" name="password" type="password" placeholder="Password" oninput="psw()" onblur="pswb()" onchange="pswc()">
</div>
<div id="passunFormal"></div>
</div>
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>Repeat Password *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="rpassword" name="rpassword" type="password" placeholder="Repeat Password" oninput="rpsw()" onblur="rpswb()">
</div>
<div id="rpassunFormal"></div>
</div>
<!--other-->
<div class="f-row">
<div class="f-col s12 m6 l4">
<h6>Role *</h6>
</div>
<div class="f-col s12 m6 l8">
<select name="role">
<option class="t">Admin</option>
<option class="t">Author</option>
</select>
</div>
</div>
</div>
<div class="f-col s12 m6 l6">
<div class="f-row">
<div class="f-col s12 m6 l4">
<h6>Profile image</h6>
</div>
<div id="img" class="f-col s12 m6 l6">
<label for="uploadphoto">Upload picture</label>
<input type="file" name="uploadphoto" id="uploadphoto">
<span id="fsoc" style="float:right;"></span>
</div>
</div>
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>Website</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="website" name="website" type="text" placeholder="Website" onchange="webValid()">
</div>
<div id="webUrl"></div>
</div>
<div class="f-row">
<div class="f-col s12 m6 l4">
<h6>Details</h6>
</div>
<div class="f-col s12 m6 l8">
<textarea name="details" rows="5" cols="10" placeholder="BY MIND: Impossible is possible"></textarea>
</div>
</div>
<div class="f-row">
<div style="float:right;" class="f-col s12 m6 l4">
<input id="sbmt" type="submit" value="Sign up">
</div>
<div id="success"></div>
</div>
</div>
</div>
</form>
答案 0 :(得分：0)
将e.preventdefault（）移动到函数的顶部。然后你会在控制台中看到错误
＆＃34; message＆＃34;：＆＃34; Uncaught TypeError：e.unbind不是函数＆＃34;
您还需要将文档.ready之后的括号移到它之前。它不是fsocietyApp函数的一部分
所以这是错误的：
e.unbind(); <<<<
}
});
});
} <<<<<<<
可能你的意思是$(this).unbind("submit")但我不推荐它，因为下次点击会提交表格
同样fnvaluf未定义，formURL
我想你想在提交中调用fsocietyApp（）：
function fsocietyApp() {
/* other code */
} // the end bracket belongs HERE
$(document).ready(function() {
$("#formid").on("submit", function(e) {
e.preventDefault(); // belongs HERE in case of other errors further down
if (fsocietyApp()) { // validate
var formObj = $(this);
var formURL = formObj.attr("action");
if (window.FormData !== undefined) {
var formData = new FormData(this);
$.ajax({
url: formURL,
type: 'POST',
data: formData,
mimeType: "multipart/form-data",
contentType: false,
cache: false,
processData: false,
success: function(data, textStatus, jqXHR) {
$("#multi-msg").html('<pre><code>' + data + '</code></pre>');
$("#formid")[0].reset();
},
error: function(jqXHR, textStatus, errorThrown) {
$("#multi-msg").html('<pre><code class="prettyprint">AJAX Request Failed<br/> textStatus=' + textStatus + ', errorThrown=' + errorThrown + '</code></pre>');
}
});
// e.unbind(); // <<<<<<< gave error
}
} // end if valid
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="formid" method="post" onsubmit="return fsocietyApp()" action="phppath/sucms.php" enctype="multipart/form-data">
<div id="form" class="f-row">
<div class="f-col s12 m12 l12">
<h2>Sign up CMS</h2>
</div>
<div class="f-col s12 m6 l6">
<!--firstname-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>First name *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="fname" name="name" type="text" placeholder="First name" onblur="fnameunFormalb()" oninput="fnameunFormal()">
</div>
<div id="fnunFormal"></div>
<div id="fnunFormalb"></div>
</div>
<!--lastname-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>Last name *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="lname" name="lname" type="text" placeholder="Last name" onblur="lnameunFormalb()" oninput="lnameunFormal()">
</div>
<div id="lnunFormal"></div>
<div id="lnunFormalb"></div>
</div>
<!--username-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6 id="theofile">Username *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="nfsoc" name="uname" type="text" placeholder="Username" onblur="usrFsoc()" oninput="usrFsoc2()" onfocus="usrColor()">
</div>
<div id="usrunFormal"></div>
</div>
<!--email-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>E-mail *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="email" type="text" name="email" placeholder="E-mail" onblur="validateEmailb()" onfocus="validateEmail()">
</div>
<div id="emailunFormal"></div>
</div>
<!--password-->
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>Password *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="password" name="password" type="password" placeholder="Password" oninput="psw()" onblur="pswb()" onchange="pswc()">
</div>
<div id="passunFormal"></div>
</div>
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>Repeat Password *</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="rpassword" name="rpassword" type="password" placeholder="Repeat Password" oninput="rpsw()" onblur="rpswb()">
</div>
<div id="rpassunFormal"></div>
</div>
<!--other-->
<div class="f-row">
<div class="f-col s12 m6 l4">
<h6>Role *</h6>
</div>
<div class="f-col s12 m6 l8">
<select name="role">
<option class="t">Admin</option>
<option class="t">Author</option>
</select>
</div>
</div>
</div>
<div class="f-col s12 m6 l6">
<div class="f-row">
<div class="f-col s12 m6 l4">
<h6>Profile image</h6>
</div>
<div id="img" class="f-col s12 m6 l6">
<label for="uploadphoto">Upload picture</label>
<input type="file" name="uploadphoto" id="uploadphoto">
<span id="fsoc" style="float:right;"></span>
</div>
</div>
<div id="rfname" class="f-row">
<div class="f-col s12 m6 l4">
<h6>Website</h6>
</div>
<div class="f-col s12 m6 l8">
<input id="website" name="website" type="text" placeholder="Website" onchange="webValid()">
</div>
<div id="webUrl"></div>
</div>
<div class="f-row">
<div class="f-col s12 m6 l4">
<h6>Details</h6>
</div>
<div class="f-col s12 m6 l8">
<textarea name="details" rows="5" cols="10" placeholder="BY MIND: Impossible is possible"></textarea>
</div>
</div>
<div class="f-row">
<div style="float:right;" class="f-col s12 m6 l4">
<input id="sbmt" type="submit" value="Sign up">
</div>
<div id="success"></div>
</div>
</div>
</div>
</form>