ページをリロードせずに AJAX を使用して Div のコンテンツを動的に更新するにはどうすればよいですか?

ページのコンテンツを動的に更新する

このコードは、リンクをクリックすると、ページをリロードせずに div 要素のコンテンツを動的に更新することを目的としています。

PHP で生成されたページ

<?php
$id = '1';

function recp($rId) {
    $id = $rId;
}
?>

<a href="#" onClick="<?php recp('1') ?>" > One   </a>
<a href="#" onClick="<?php recp('2') ?>" > Two   </a>
<a href="#" onClick="<?php recp('3') ?>" > Three </a>

<div>

JavaScript 拡張バージョン

<script type="text/javascript">
function recp(id) {
  $('#myStyle').load('data.php?id=' + id);
}
</script>

<a href="#" onClick="recp('1')" > One   </a>
<a href="#" onClick="recp('2')" > Two   </a>
<a href="#" onClick="recp('3')" > Three </a>

<div>

データ取得用の PHP スクリプト

<?php
require ('myConnect.php');     
$id = $_GET['id'];
$results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");   
if( mysql_num_rows($results) > 0 )
{
$row = mysql_fetch_array( $results );
echo $row['para'];
}
?>

この設定では、リンクのいずれかをクリックすると、recp JavaScript がトリガーされますこの関数は、jQuery の .load() メソッドを使用して、AJAX 経由で data.php スクリプトからデータを取得します。その後、データが #myStyle div にロードされ、ページを更新せずにそのコンテンツが動的に更新されます。

以上がページをリロードせずに AJAX を使用して Div のコンテンツを動的に更新するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。