ASP의 무한 분류와 js 축소 및 확장 기능 예제 코드
이번 예제에서는 주로 ASP를 이용한 무제한 분류 기능과 JS를 이용한 축소 및 확장 기능을 간략하게 소개합니다.
작업 전에 필드가 다음과 같은 분류 테이블 카테고리를 정의했습니다.
id (자동 번호) cat_name (카테고리 이름) parent_id (상위 ID, 이 테이블의 ID에 해당) cat_order (순서) is_show (표시 여부) u_id (뉴스 카테고리인지, 상품 카테고리인지 구분하는데 사용됩니다) 또는 기타 카테고리) 편의상 이러한 모든 카테고리를 이 표에 넣었습니다.
고객 카테고리 추가시 카테고리가 너무 많아 처음 프런트에 표시할 땐 전부 표시되어 너무 길어졌습니다. 고객께서 수정 제안을 주셨고, 큰 카테고리를 클릭하시면 해당 하위 카테고리도 표시되도록 변경해 달라고 요청하셨습니다. 또한 각 카테고리 아래에는 점선이 있고, 큰 카테고리 앞에는 그림 더하기 기호가 있습니다. 확장 후에는 마이너스 기호가 됩니다.
<스크립트>
함수 fd(id,num)
{
t=$(c+id+_1).style.display;
if(t==없음)
{
t1=차단;
t2=이미지/fll_34.gif;
}
또 다른
{
t1=없음;
t2=이미지/fll_34.gif;
}
for(i=1;i<=num;i++)
{
$(c+id+_+i).style.display=t1;
$(d_+id).src=t2;
}
}
함수 $(id)
{
return document.getElementById(id);
}
</script>
이것은 ASP 무제한 디스플레이 카테고리 코드이며 이러한 카테고리에 ID를 추가합니다.
<%
'기능: asp 무제한 표시 분류 + js 표시 및 숨기기
'저자 : 왕동
'개발: www.aspprogram.cn
'매개변수: parent_id는 상위 ID이고 stype은 뉴스, 제품 및 기사 카테고리입니다.
'원본 기사입니다. 재인쇄 시 일부 정보를 남겨주세요. 감사합니다.
함수 cat111(parent_id,stype)
rs1 =server.createobject(adodb.recordset) 설정
sql=선택 cat_name,cat_id,parent_id 카테고리에서 parent_id=&parent_id& 및 u_id=&stype& 및 is_show=1 주문 by cat_order asc
rs1=conn.execute(sql) 설정
rs1.eof이면
또 다른
if(depath>2) 그러면
디스플레이2=없음
또 다른
디스플레이2=차단
종료하면
희미한 J
j=1
rs1.eof가 아닌 동안 수행
cat_name1 = rs1(고양이_이름)
cat_id1 = rs1(cat_id)
parent_id1=rs1(부모_ID)
'********************다음은 표시하려는 ****************입니다.'
m9=0
sql2=parent_id=&cat_id1& 및 u_id=&stype&인 범주에서 t로 count(cat_id)를 선택합니다.
rs2=server.createobject(adodb.recordset) 설정
rs2=conn.execute(sql2)를 설정합니다.
rs2.eof가 아니면
m9=rs2(t)
또 다른
m9=0
종료하면
RS2.닫기
if(depath<=2) 그러면
mgif=이미지/-.gif
a=차단
또 다른
만약(m9>0) 그렇다면
mgif=이미지/+.gif
또 다른
mgif=이미지/-.gif
종료하면
if(depath=4) 그러면
a=차단
또 다른
a=없음
종료하면
종료하면
catstr=catstr & <tr id=c&parent_id&_&j& style=display:&a&><td width=25 align=center valign=middle class=dotted_class><img src=&mgif& width=12 height=11 id=d_&cat_id1&></td>< td 클래스=dotted_class leftcatcss>
만약(m9>0) 그렇다면
catstr=catstr&<a href=javascript:void(0); _fcksavedurl=javascript:void(0);fd(&cat_id1&,&m9&)> &vbnewline
또 다른
catstr=catstr&<a href=products.asp?id=&cat_id1& target=_blank>&vbnewline
종료하면
i=1에서 출발하려면
catstr=catstr
다음
catstr=catstr&cat_name1&</a></td></tr>&vbnewline
m9=0
sql2=선택 cat_name,cat_id 카테고리에서 parent_id=&parent_id1& 및 u_id=&stype& 주문 by cat_order asc
rs2=server.createobject(adodb.recordset) 설정
rs2=conn.execute(sql2)를 설정합니다.
rs2.eof가 아니면
디패스=디패스+4
cat111(cat_id1,stype)에 전화하세요.
종료하면
RS2.닫기
rs2=아무것도 설정하지 않음
depath=depath-4
'********************위 내용은 ****************** 표시하려는 내용입니다.'
j=j+1
rs1.movenext
고리
종료 조건
RS1.닫기
rs1=아무것도 설정하지 않음
종료 기능
%>
이 기능을 사용하기 전에 추가
catstr=
그런 다음 다시 호출하고 CSS의 dotted_class에 다음 점선을 추가합니다.
현재까지 모든 기능이 구현되었습니다.