다시 로드하지 않고 AJAX를 사용하여 웹 페이지 콘텐츠를 동적으로 업데이트하는 방법은 무엇입니까?

다시 로드하지 않고 HTML 페이지 콘텐츠를 동적으로 변경

페이지를 트리거하지 않고 웹페이지 콘텐츠, 특히 div를 동적으로 업데이트하고 싶습니다. 새로 고치다. 이는 AJAX(Asynchronous JavaScript and XML)를 통해 달성할 수 있습니다.

jQuery 접근 방식

1. JavaScript 함수 정의:

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

   로그인 후 복사

2. 이벤트 핸들러 추가:
   HTML의 onClick 핸들러를 recp 함수로 교체:

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

   로그인 후 복사

3. PHP 스크립트 만들기:
   데이터 검색을 처리하는 data.php와 같은 별도의 PHP 파일 만들기:

   <code class="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'];
   }</code>

   로그인 후 복사

4. 동적으로 데이터 로드:
   링크를 클릭하면 recp 함수는 AJAX를 사용하여 data.php의 데이터를 ID가 'myStyle'인 div로 로드합니다.

   <code class="html"><div id='myStyle'>
   </div></code>

   로그인 후 복사

참고: jQuery load() 함수의 data.php 경로가 올바른지, PHP 파일에 적절한 권한이 있는지 확인하세요.

위 내용은 다시 로드하지 않고 AJAX를 사용하여 웹 페이지 콘텐츠를 동적으로 업데이트하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!