Question

我有一个简单的<button type="submit" onClick="dothis();">Click</button>。

以下此脚本没有问题，

$(document).ready(function() {
  action = 'test';
  $.ajax({
    url:'ajax.php',
    data: 'action='+action,
    type:'GET',
    dataType:'json',
    timeout:7000,
    error:function(){ alert('Error!'); return false; },
    success:function(json){ alert('ok'); }
  });
});

但是当我把它投入使用时它就不起作用了，

function dothis(){
  action = 'test';
  $.ajax({
    url:'ajax.php',
    data: 'action='+action,
    type:'GET',
    dataType:'json',
    timeout:7000,
    error:function(){ alert('Error!'); return false; },
    success:function(json){ alert('ok in function'); }
  });
}

将ajax放入函数的正确方法是什么？

Answer 1

您可能必须取消提交按钮上的默认操作，因为它可能正在发送表单并重新加载页面。您的ajax通话已收到，但随后该网页会立即重新加载，因此您无法看到该结果。

您可以通过添加

取消默认操作

return false;

到doThis()的结尾。

function dothis(){
  action = 'test';
  $.ajax({
    url:'ajax.php',
    data: 'action='+action,
    type:'GET',
    dataType:'json',
    timeout:7000,
    error:function(){ alert('Error!'); return false; },
    success:function(json){ alert('ok in function'); }
  });
  return false;
}

或者，将按钮更改为普通按钮，而不是提交按钮。

Answer 2

更改按钮类型＆＃34;提交＆＃34;到＆＃34;按钮＆＃34; 要么你需要preventDefault（）

$('someform').on('submit', function(ev){
  ev.preventDefault();
  action = 'test';
  $.ajax({
    url:'ajax.php',
    data: 'action='+action,
    type:'GET',
    dataType:'json',
    timeout:7000,
    error:function(){ alert('Error!'); return false; },
    success:function(json){ alert('ok'); }
  });

});

检查一下 http://api.jquery.com/event.preventdefault/

Jquery ajax无法正常工作

2 个答案: