如何使用 Ajax、PHP 和 jQuery 動態更新 DIV 內容？

使用 Ajax、PHP 和 jQuery 修改 DIV 內容

在 Web 開發中，通常需要更新頁面的部分內容而不重新載入整個頁面。這可以使用 Ajax、PHP 和 jQuery 來實現。

問題陳述

頁麵包含一個 DIV 元素，其中包含來自資料庫的文字和超連結清單。目標是在單擊特定連結時將與該連結關聯的摘要（文字）載入到 DIV 中。

解決方案

HTML:

依照描述建立DIV 與連結元素：

<code class="html"><div id="summary">Here is summary of movie</div>

<a href="?id=1" class="movie">Name of movie</a>
<a href="?id=2" class="movie">Name of movie</a></code>

ScriptScript

>

<code class="javascript"><script>
function getSummary(id) {
  $.ajax({
    type: "GET",
    url: 'your_php_url',
    data: "id=" + id,
    success: function(data) {
      $('#summary').html(data);
    }
  });
}
</script></code>

處理連結上的點擊事件：

PHP:

<code class="php">// get the ID from the request
$id = $_GET['id'];

// fetch the summary from the database
$summary = get_summary($id);

// return the summary as a string
echo $summary;</code>

在PHP 檔案中處理GET 請求：

事件綁定：

<code class="html"><a onclick="getSummary('1')">View Text</a>
<div id="#summary">This text will be replaced when the onclick event (link is clicked) is triggered.</div></code>

新增將onclick 事件屬性傳遞給連結以呼叫getSummary 函數：

以上是如何使用 Ajax、PHP 和 jQuery 動態更新 DIV 內容？的詳細內容。更多資訊請關注PHP中文網其他相關文章！