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

透過jQuery、Ajax 和PHP 動態更新DIV 內容

考慮一個場景，其中您有一個包含動態內容的DIV 的網頁來自資料庫：

<div id="summary">Here is a summary of movie</div>

此外，還有連結清單：

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

當使用者點擊連結時：

1. 使用GET 資料的Ajax 請求： 頁面使用連結的URL 發送Ajax 請求，透過GET 將資料傳遞到PHP 檔案（通常是同一頁）。
2. 帶字串的 PHP 回應： PHP 檔案處理請求並傳回包含摘要文字的字串。
3. DIV 內容更新： 使用 jQuery，使用傳回的字串更新 DIV 的 #summary 元素。

要實現此功能：

<code class="javascript">function getSummary(id) {
  $.ajax({
    type: "GET",
    url: 'Your URL',
    data: "id=" + id, // accessible as $_GET['id'] in PHP
    success: function(data) {
      $('#summary').html(data);
    }
  });
}</code>

在 HTML 中，為每個連結新增 onclick 事件：

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

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