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

無論是從類型更改您的按鈕 「提交」， 「按鈕」 或 你需要的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/