Bagaimana untuk Mengubah Suai Kandungan Halaman Secara Dinamik Menggunakan AJAX Tanpa Menyegarkan?

Susan Sarandon
Lepaskan: 2024-10-22 10:40:11
asal
428 orang telah melayarinya

How to Modify Page Content Dynamically Using AJAX Without Refreshing?

Mengubah suai Kandungan Halaman Secara Dinamik Tanpa Menyegarkan

Masalah:

Anda mahu memaparkan data yang diambil daripada pangkalan data dalam div dan kemas kini kandungan div apabila pautan diklik, tanpa memuat semula halaman.

Penyelesaian:

Untuk mencapainya, anda boleh menggunakan AJAX (Asynchronous JavaScript and XML), yang membolehkan anda membuat permintaan tak segerak ke pelayan tanpa memuatkan semula halaman. Begini cara untuk melaksanakannya:

1. Cipta Fungsi JavaScript:

Tambah pengendali acara onclick pada pautan yang mencetuskan fungsi JavaScript. Fungsi ini akan menggunakan AJAX untuk membuat permintaan kepada skrip PHP dan mendapatkan semula data yang dikemas kini.

<code class="javascript">function recp(id) {
  $('#myStyle').load('data.php?id=' + id);
}</code>
Salin selepas log masuk

2. Tambah Permintaan AJAX:

Dalam fungsi JavaScript, gunakan kaedah jQuery $.load() untuk menghantar permintaan AJAX kepada skrip PHP yang mengandungi kod untuk mengambil data.

3. Cipta Skrip PHP:

Buat fail PHP yang berasingan (cth., data.php) yang akan mengendalikan permintaan AJAX. Skrip ini hendaklah:

  1. Sambung ke pangkalan data.
  2. Dapatkan semula data berdasarkan parameter id yang diluluskan dalam permintaan.
  3. Kembalikan data yang diambil semula kepada klien .
<code class="php"><?php
// Connect to database
require ('myConnect.php');

// Get the ID parameter
$id = $_GET['id'];

// Fetch data from database
$results = mysql_query("SELECT para FROM content WHERE para_ID='$id'");

// Check if data exists
if( mysql_num_rows($results) > 0 ) {
  $row = mysql_fetch_array( $results );
  echo $row['para'];
}
?></code>
Salin selepas log masuk

4. Kemas Kini Kandungan Div:

Respons daripada skrip PHP akan dipaparkan dalam div dengan id 'myStyle'. Kandungan div akan dikemas kini secara dinamik tanpa memuatkan semula halaman.

Nota Tambahan:

  • Anda mungkin perlu melaraskan URL permintaan AJAX dan sambungan pangkalan data tetapan dalam skrip JavaScript dan PHP agar sepadan dengan persekitaran khusus anda.
  • Anda boleh mengetahui lebih lanjut tentang AJAX dengan merujuk sumber dalam talian atau mengikuti kursus untuk meningkatkan pemahaman anda tentang pengaturcaraan tak segerak.

Atas ialah kandungan terperinci Bagaimana untuk Mengubah Suai Kandungan Halaman Secara Dinamik Menggunakan AJAX Tanpa Menyegarkan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!