페이지를 다시 로드하지 않고 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!