> 백엔드 개발 > PHP 문제 > PHP에서 왼쪽 탐색 메뉴를 구현하는 방법

PHP에서 왼쪽 탐색 메뉴를 구현하는 방법

PHPz
풀어 주다: 2023-04-06 12:30:01
원래의
928명이 탐색했습니다.

웹사이트 개발에서는 클릭 가능한 왼쪽 탐색 메뉴를 구현하는 것이 매우 일반적인 요구 사항입니다. PHP 언어를 사용하여 이 함수를 작성하는 것도 효율적이고 간단한 방법입니다.

1. 준비

클릭 내비게이션 메뉴를 구현하기 전에 몇 가지 기본 조건을 준비해야 합니다. 필요한 조건은 다음과 같습니다.

1. PHP 언어 코드가 필요합니다.
2. HTML, CSS 및 JavaScript에 대한 지식이 필요합니다.

조건이 충족되었는지 확인한 후 다음 단계를 시작할 수 있습니다.

2. 데이터베이스 테이블 설정

내비게이션 메뉴 클릭 기능을 올바르게 구현하려면 메뉴를 저장할 테이블을 데이터베이스에 생성해야 합니다. 다음은 표의 열 요구사항입니다.

1. 메뉴 ID: 각 메뉴 항목의 고유 식별자

2. 메뉴 제목: 각 메뉴의 제목
3. ;
4. 상위 메뉴 ID: 이 메뉴 항목이 속한 상위 메뉴
5. 메뉴 아이콘: 선택 사항, 미학 또는 인터페이스 기능 보충에 사용됩니다.

양식을 만든 후 PHP 코드에서 이를 호출하여 탐색 메뉴를 클릭하는 기능을 구현할 수 있습니다.

3. PHP에서 탐색 메뉴 구현

데이터베이스 테이블 디자인이 끝나면 PHP 코드를 사용하여 이 탐색 메뉴를 만들 수 있습니다. 여기서는 다음 명령을 사용합니다:

$parent_id = 0;
$menu_query = mysql_query("SELECT id, title, link FROM menu WHERE parent_id='".$parent_id."'");
while ($menu_row = mysql_fetch_array($menu_query)) {
echo '
  • '.$menu_row['title'].' ;/li>';
    }
    ?>
    위 코드에서는 먼저 값이 0인 $parent_id 변수를 정의합니다. 이 변수의 의미는 검색할 "상위" 메뉴를 나타냅니다. mysql_query() 함수를 사용하여 데이터베이스의 메뉴 테이블을 쿼리하고, mysql_fetch_array() 함수를 통해 메뉴 항목을 가져옵니다.

    PHP에서는 이러한 메뉴 항목을 HTML 코드 출력으로 변환하는 것이 매우 간단합니다. echo 명령을 사용하여 완료할 수 있습니다. 마지막으로 프런트 엔드 인터페이스에서 다음과 유사한 메뉴를 볼 수 있습니다.

      Home
    • About Us
    • Contact Us
    위 코드에는 매우 중요한 함수 mysql_query()도 있습니다. 이 함수의 입력값은 "안전"합니다. 들어오는 매개변수를 필터링하지 않으면 SQL 주입 공격으로 이어져 보안 문제가 발생할 수 있습니다. 이 문제를 피하는 쉬운 방법은 addlashes() 함수를 사용하는 것입니다.

    4. JavaScript 클릭 이벤트 추가

    탐색 메뉴를 출력하는 PHP 코드를 구현했습니다. 이제 사용자가 메뉴 항목을 클릭하여 해당 링크 주소를 입력할 수 있도록 JavaScript 클릭 이벤트를 추가해야 합니다. 다음은 코드의 논리적 구조입니다.

    1. 사용자가 메뉴 항목을 클릭하면 JavaScript 함수가 이벤트를 트리거합니다.

    2. 이 함수는 XMLHttpRequest 개체를 사용하여 서버에 요청을 보냅니다. . 서버는 해당 페이지를 반환하고 사용자의 브라우저 창에 렌더링합니다.

    코드에 JavaScript 및 XMLHttpRequest 개체를 추가합니다. 코드는 다음과 같습니다.

    <script></p>function displayLink(link) {<p>var xhttp;<br>if (link == "") {<br>document.getElementById( "links_container").innerHTML = "";<br>return;<br>}<br>xhttp = new XMLHttpRequest();<br>xhttp.onreadystatechange = function() {<br>if (this.readyState == 4 && this.status == 200) { <br>document .getElementById("links_container").innerHTML = this.responseText;<br>}<br>};<br>xhttp.open("GET", link, true);<br>xhttp.send();<br>}<br></script>

    위 코드에서는 메뉴 항목을 클릭할 때 XMLHttpRequest 객체를 보내는 displayLink() 함수를 만들었습니다. 반환된 XMLHttpRequest 개체의 상태가 200(즉, 데이터를 성공적으로 가져옴)이면 이를 프런트 엔드 페이지에 출력하고 사용자의 브라우저 창에 표시합니다.

    마지막으로 HTML에서는 onMouseDown 이벤트 핸들러 함수를 사용하고 메뉴 항목을 클릭하면 displayLink() 함수를 호출합니다.

    5. 요약

    클릭 가능한 왼쪽 탐색 메뉴 구현은 웹 사이트 개발에 매우 ​​필요합니다. PHP를 사용하면 탐색 메뉴를 신속하고 동적으로 생성할 수 있으며, JavaScript를 사용하면 사용자가 메뉴를 클릭하여 대상 링크 주소에 빠르게 도달할 수 있습니다.

    위 내용은 PHP에서 왼쪽 탐색 메뉴를 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

  • 원천:php.cn
    본 웹사이트의 성명
    본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
    인기 튜토리얼
    더>
    최신 다운로드
    더>
    웹 효과
    웹사이트 소스 코드
    웹사이트 자료
    프론트엔드 템플릿