負載PHP內容與jQuery AJAX

我的index.html：

<form action="toload.php" method="post"> 
Input: <input type="text" name="something" value="" /><br /> 
<input type="submit" value="Submit!" /> 
</form>

toload.php是一樣的東西：

<?php 

echo "Your input was: " . $_POST["something"]; 

?>

的問題很簡單。

當我按下Submit!按鈕時，我想動態加載內容toload.phpindex.html而不需要刷新。

在此先感謝！請評論任何需要的澄清。

編輯，更詳細的解釋：

我不知道我是清楚的（或者也許我不理解的答案做我缺乏技術技能），所以我會再給它一次。（重寫）

我有一個提交按鈕通過POST方法發送變量的HTML。

這個變量被一個PHP文件使用，經過一定的處理後，它插入並更新一個MySQL數據庫並回應出其他的東西。

這是工作JUST FINE。

但現在我想通過避免頁面「重新加載」（進入.php）來改進它。

我希望HTHL作爲我的HTML文件的輸出來動態顯示在我的HTML頁面中。

現在更清楚了嗎？

來源

2011-01-29 Trufa

退房http://api.jquery.com/load/ – 2011-01-29 23:00:40

`$（「＃divname」）負載。（URL，{東西：$（「東西」）VAL（）;}） `應該這樣做 – 2011-01-29 23:01:32

像這樣使用jQuery !:

<form action="toload.php" method="post"> 
Input: <input type="text" id="something" name="something" value="" /><br /> 
<input type="submit" value="Submit!" onclick="submitme()" /> 
<div id="something2"></div> 
</form>

和功能提交：

function submitme(){ 
var tosend=document.getElementById("something").value; 
$.ajax({ 
     type: 'POST', 
     url: 'toload.php', 
     data: 'something='+tosend, 
     success: function(msg){ 
      if(msg){ 
       document.getElementById("something2").innerHTML=msg; 
      } 
      else{ 
       return; 
      } 
     } 
    }); 
}

來源

2011-01-29 23:06:24 FeRtoll

您必須爲此使用AJAX（XMLHttpRequest） - http://www.w3schools.com/XML/xml_http.asp。

（你只說了一句 - jQuery的，只要裝載100KB不是簡單恕我直言，我認爲純JavaScript解決方案）

來源

2011-01-29 23:02:39 singles

順便說一句，你可能想提到jQuery是* not * 100kB。 – alex 2011-01-29 23:11:04

@Trufa，XMLHTTPRequest其實並不難。它允許您以編程方式發送請求，其方式與瀏覽器在加載頁面時所用的方式相同。您可以捕獲返回值（PHP的輸出）並根據需要使用它。但是這個對象被包裝在JQuery中，這使得它更容易和更好的跨瀏覽器兼容。 – GolezTrol 2011-01-29 23:11:52

你的情況，你可以使用$.post()^DOCS。如果你給你的形式id="myForm"然後如下，你可以加載返回數據到窗體的父回調：

$('#myForm').submit(function(e){ 
    e.preventDefault(); 
    $.post("toload.php", $("#myForm").serialize(), function(data) { 
    $(this).parent().html(data); 
    }); 
});

來源

2011-01-29 23:05:48 mVChr

負載PHP內容與jQuery AJAX

回答

相關問題