Question

我有以下代码，它在提交表单时有效（它保留在同一页面上）但我也希望在提交后刷新当前页面。

<script>
$('form').live('submit', function(){
  $.post($(this).attr('action'), $(this).serialize(), function(response){
  // Here I need a code to refresh the page. I tried with window.location.reload(); no      success...
  },'json');
  $('form').hide();
  return false;
});

感谢您提供帮助

Answer 1

“返回false;”在jQuery中的工作方式与普通javascript javascript中的工作方式不同。使用preventDefault：

$('form').live('submit', function(e){
    $('form').hide();
    e.preventDefault();
});

另外，如果你可以提供帮助，我不建议使用“live”...如果你可以使用$（document）.ready和$（'form'）。submit（function（e）{ ...}）;

----编辑1：

我在您的页面上注意到（在您的评论中注明）您收到错误： “XMLHttpRequest无法加载http://emails.loquierocomprar.com.co/wp-content/plugins/mailpress/mp-includes/action.php。Access-Control-Allow-Origin不允许原点http://www.loquierocomprar.com.co。”

$ .post调用失败，从不发送ajax post请求。因此，永远不会触发成功处理程序，并且最终永远不会调用window.location.refresh方法。

其次，您正在使用数据类型'json' - 如果服务未返回格式正确的json，则成功处理程序也将无法正确触发。

Answer 2

您希望自然提交HTML表单并隐藏表单。

您无法在提交之前隐藏表单，否则浏览器将无法获取/发布其隐藏字段，因此您必须在sumbission之后隐藏它。最简单的方法是使用setTimeout。

$(document).on('submit', 'form', function() {
  var $form = $(this);//remember $form in the closure
  setTimeout(function(){ $form.hide(); }, 0);//hide $form *after* submission
  return true;//allow natural html form submission to happen
});

即使setTimeout延迟设置为零，$form.hide()也会在表单提交发生后（在原始提交线程中）从不同的事件线程执行。

Jquery - Ajax。同一页面并在表单提交后刷新

2 个答案: