我通过action方法将表单发布到远程服务器,但是在发布之前调用jquery函数来更新数据库 - 所有工作在IE,FF等都可以正常工作......但是,Safari总是无法做到当return为true时,jquery数据库插入或async:true,...如果两者都为false,(因此html表单由于虚假声明而无法发布),它是否完美?但是当它为true时,表单只会POST,但jquery ajax post不会运行?
表格......
<form action="http://anotherplace" method="post" id="myform" >
<button class="button-big" type="submit" id="myform-post" ><span>Continue</span></button>
功能......
$(document).ready(function() { //available when doc renders
$("form#myform").submit(function(){
var title = $("select#title").val();
if (title == "") {
$("select#title").css({backgroundColor:"#ccc"});
$("select#title").focus();
return false;
}
var firstname = $("input#fname").val();
if (firstname == "") {
$("input#fname").css({backgroundColor:"#ccc"});
$("input#fname").focus();
return false; }
var surname = $("input#sname").val();
if (surname == "") {
$("input#sname").css({backgroundColor:"#ccc"});
$("input#sname").focus();
return false; }
//Grab the form values to pass via AJAX for DB insert
var cameraMake = $("input#cameraMake").val();
var cameraModel = $("input#cameraModel").val();
var cameraValue = $("input#cameraValue").val();
var mp3Make = $("input#mp3Make").val();
var mp3Model = $("input#mp3Model").val();
var mp3Value = $("input#mp3Value").val();
var dataString='&title='+ title + '&firstname=' + firstname + '&surname=' + surname + '&add1=' + add1 + '&add2=' + add2 + '&add3=' + add3 + '&pcode=' + pcode + '&email=' + email + '&phone=' + phone +'&username=' + username + '&pword=' + pword;
var ajaxComplete = false;
if( !ajaxComplete ){
$.ajax({
async: true,
type: "POST",
url: "process-.php",
data: dataString,
success: function() {
// $('#details').html("<div id='post-message'></div>");
// $('#post-message').html("<h2 style='color:#fff'>Thanks for getting in touch.</h2>")
ajaxComplete = true;
this.submit();
}
});
return false; // Abort form submission by now
}else{
return true; // Submit normally
}
});
}); //End of document.ready
脚本基于提交ID运行“click”方法(然后验证AJAX帖子)。
如果在Safari(所有测试版本)中失败,或者提供更好的解决方案来满足我的需求,那么ayone能提供任何建议吗? - 与异步/发布有关的事情?正如我所说,设置为false,它工作正常......但是,我需要HTML表单仍然发布!
非常感谢!
答案 0 :(得分:1)
如果我理解正确,您希望在有待处理的AJAX请求时卸载页面。这几乎没有机会正常工作,即使在它似乎工作的浏览器中也是如此。
我的建议是最初中止表单的POST请求(return false;
)并将代码添加到success
处理程序以在AJAX请求完成时触发表单提交。您可以使用标志变量,以便AJAX请求仅在第一次触发。
<强>更新强>
一些快速,肮脏和未经测试的代码。我也意识到你已经省略了代码块的开头所以我只是发明了它:
var ajaxComplete = false;
$("form#3-form").submit(function(){
if( !ajaxComplete ){
$.ajax({
async: true,
type: "POST",
url: "process-.php",
data: dataString,
success: function() {
$('#details').html("<div id='post-message'></div>");
$('#post-message').html("<h2 style='color:#fff'>Thanks for getting in touch.</h2>")
ajaxComplete = true;
this.submit();
}
});
return false; // Abort form submission by now
}else{
return true; // Submit normally
}
});
答案 1 :(得分:0)
你应该使用
return false;
然后进行表单操作
window.location.url = "YOUR URL";
所以
$.ajax({
async: true,
type: "POST",
url: "process-.php",
data: dataString,
success: function() {
$('#details').html("<div id='post-message'></div>");
$('#post-message').html("<h2 style='color:#fff'>Thanks for getting in touch.</h2>");
window.location.url = "YOUR URL";
}
});
return false;