將Ajax/jQuery Post函數轉換爲jQuery

這裏是我的原始函數。它完美的作品，我只是想壓縮了一點：將Ajax/jQuery Post函數轉換爲jQuery

<script type='text/javascript'> 
function searchmusic(){ 
var ajaxRequest; 

try{ 
    ajaxRequest = new XMLHttpRequest(); 
} catch (e){ 
    try{ 
     ajaxRequest = new ActiveXObject('Msxml2.XMLHTTP'); 
    } catch (e) { 
     try{ 
      ajaxRequest = new ActiveXObject('Microsoft.XMLHTTP'); 
     } catch (e){ 
      alert('Your browser broke!'); 
      return false; 
     } 
    } 
} 
ajaxRequest.onreadystatechange = function(){ 
    if(ajaxRequest.readyState == 4){ 
     var ajaxDisplay = document.getElementById('searchresults'); 
     ajaxDisplay.innerHTML = ajaxRequest.responseText; 

    } 
} 
var search = document.getElementById('search').value; 
var params = 'search=' + search; 
ajaxRequest.open('POST', 'getsearch.php', true); 
ajaxRequest.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); 
ajaxRequest.send(params); 

} 
</script>

我想壓縮這個功能了一下，這就是我一直使用jQuery複製它：

<script> 
function searchmusic(){ 
var search = document.getElementById('search').value; 
$.ajax({ 
type: 'POST', 
url: getsearch.php, 
async: true, 
data: 'search=' + search, 
success: function(data) { 
$('#searchresults').load(data); 
} 
}); 
} 
</script>

然而，我無法使此功能正常工作。有人能告訴我我犯了什麼錯誤，爲什麼這個功能不起作用，或者可能是這個新功能不能像我原來那樣工作。我不知道，但任何幫助將不勝感激，謝謝！

來源

2012-06-18 Eggo

您缺少網址附近的引號。是複製/過去的問題還是代碼中？ – Ariel

@Ariel。 10秒前... :) – gdoron

這是我的錯，我忘了報價。我添加了它們，但功能仍然不起作用。 – Eggo

url: getsearch.php,

應該

url: 'getsearch.php',

和

success: function(data) { 
    $('#searchresults').load(data); 
}

應該

success: function(data) { 
    $('#searchresults').html(data); 
}

而且還var search = document.getElementById('search').value;是好的，但因爲你需要使用jQuery所以你可以使用var search = $('#search').val()，而不是通過默認async is true所以你可以忽略它，也可以$.ajax可能是$.post，因此您可以刪除type: 'POST'。

來源

2012-06-18 23:19:47

完美的作品，非常感謝。 – Eggo

非常感謝您爲添加的提示，它是真正的讚賞。 – Eggo

不客氣:-) –

變化：

url: getsearch.php, // The property php of the getsearch variable

要：

url: 'getsearch.php', // A string with the URL.

而變化：

$('#searchresults').load(data);

要：

$('#searchresults').html(data);

來源

2012-06-18 23:16:55 gdoron

我做到了這一點，它似乎仍然沒有工作，但感謝那些信息，因爲它顯然是我的腳本的一個問題。 – Eggo

@Eggo。改變'load'。 – gdoron

完美的工作，感謝您的幫助。 – Eggo

Waaaay更緊湊：

function searchmusic(){ 
$("#searchresult").load("getsearch.php", {search: $("#search").val()}); 
}

這就是你的功能需要:)

可以使用每當一個AJAX的結果應該在一個元素中去。作爲對象傳遞的參數確保我們執行POST而不是GET調用。所以你的功能可以減少很多。

來源

2012-06-19 00:00:16 Cranio

將Ajax/jQuery Post函數轉換爲jQuery

回答

相關問題