jquery 무한 계단식 메뉴 케이스 Sharing

phpcms의 지역별 계단식 메뉴를 보고 꽤 흥미로웠기 때문에 잊어버리지 않기 위해 일반적인 단계에 대해서만 이야기했습니다.

지역별 계단식 메뉴 생성은 일반적으로 /data/cache_model/content_form.class.php 파일의 Areaid() 함수에서 이루어집니다. 하지만 이것은 단지 캐시일 뿐이고 어디서 생성되었는지 아직 찾지 못했기 때문에 현재로서는 테스트일 뿐입니다. (아는 학생들 알려주세요! 정말 감사합니다)

areid()의 $js에

코드 복사 코드는 다음과 같습니다. function delChild(num) { $('#load_$field select').each(function(i,obj){ if (obj.id >num) $('#' obj.id).remove() }) }

따라서 / load.php

코드 복사 에서 elseif($field == 'areaid' && $value)를 수정합니다. $str = ' onchange="delChild('.$id.');$('#' .$value.'').val(this.value);this.disabled=false;area_load(this.value);"> value="1">'.$LANG[' please_select'].' ';

"선택한 영역은 변경할 수 없습니다." 효과를 제거할 수 있으며, 하위 위치가 없을 경우 중복 선택 상자가 삭제되지 않습니다. 이름. 전통적인 캐스케이딩 메뉴는 개인적으로 전송 데이터가 상대적으로 크고, 데이터베이스와의 연결도 좋지 않은 것 같아서 코드를 올리지 않겠습니다.

방법 2:

코드 복사 코드는 다음과 같습니다. $(document).ready(function(){ $('.menu li').hover(function(){ $(this).children('ul').show() ; $(this).focus().addClass('focusa') },function(){ $(this).children('ul').hide() $(this).focus().removeClass('focusa') }) }); ul{ 목록 스타일:없음; 여백:0; 패딩:0;} .menu { 높이:30px; 줄 높이:30px; } .menu li { float:left; position:relative;} /*这一级是导航*/ .menu li a { display:block; 높이:30px; 줄 높이:30px; 패딩:0 20px; } .menu li a:hover { color:#000; 배경:url(img/bg1.png); } .menu li a.more { background:url(img/there.png) 반복 없음 130px center; } .menu li ul { 위치:절대; 부동:왼쪽; 너비:150px; 테두리:1px 솔리드 #000; 디스플레이:없음;} /*这是第two级菜单*/ .menu li ul a { width:110px; } .menu li ul a:hover { background:url(img/bg1.png);} .menu li ul ul{ top:0;left:150px;}/*3단계 메뉴부터 모든 하위 메뉴가 상대적으로 오프셋됩니다.*/ href="#">메뉴 1 메뉴 1 ;/li> 메뉴 2 3개 메뉴 4 ; 메뉴 1 메뉴 2 메뉴 3 메뉴 4 메뉴 5 하나 메뉴 4 메뉴 5 메뉴 1 메뉴 2 메뉴 3 메뉴 4 🎜> 메뉴 5 ; a href="#">메뉴 2 메뉴 1 메뉴 2 ; 메뉴 1 메뉴 2 메뉴 3 메뉴 1 🎜> 메뉴 2 ; 메뉴 3 메뉴 4

메뉴 4 메뉴 1 /li> 메뉴 2 메뉴 3&lt ;/a>

jquery 무한 계단식 메뉴 케이스 Sharing_jquery