h

트리메뉴를 Element ID 없이 간단히 구현하는 데모 소스

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<title>무제 문서</title>
<style type="text/css">
code {
    font: 9pt tahoma;
    cursor: pointer;
}
</style>
<script type="text/javascript">
function toggleDisplay(elem)
{
    var elem = elem.parentElement;
    for(i = 0; i < elem.children.length; i++) {
        with(elem.children[i]) {
            if(tagName == "BLOCKQUOTE") {
                if(style.display == "") {
                    style.display = "none";
                }
                else {
                    style.display = "";
                }
            }
        }
    }
}
</script>
</head>

<body>
<blockquote>
<code onClick="toggleDisplay(this);"><A HREF="">테스트1</A></code>
    <blockquote>
    <code onClick="toggleDisplay(this);"><A HREF="">테스트2</A></code>
        <blockquote>
        <code onClick="toggleDisplay(this);"><A HREF="">테스트3</A></code>
        </blockquote>
        <blockquote>
        <code onClick="toggleDisplay(this);"><A HREF="">테스트3</A></code>
        </blockquote>
    </blockquote>
    <blockquote>
    <code onClick="toggleDisplay(this);"><A HREF="">테스트2</A></code>
        <blockquote>
        <code onClick="toggleDisplay(this);"><A HREF="">테스트3</A></code>
        </blockquote>
        <blockquote>
        <code onClick="toggleDisplay(this);"><A HREF="">테스트3</A></code>
        </blockquote>
    </blockquote>
</blockquote>
<blockquote>
<code onClick="toggleDisplay(this);"><A HREF="">테스트2</A></code>
    <blockquote>
    <code onClick="toggleDisplay(this);"><A HREF="">테스트3</A></code>
    </blockquote>
    <blockquote>
    <code onClick="toggleDisplay(this);"><A HREF="">테스트3</A></code>
    </blockquote>
</blockquote>
</body>
</html>

[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]
|

댓글 2개

ie 전용인가요.

ie에서도 이상할 듯, 워낙 지 맘대로가. ie 니..

dom 표준으로 할려면

parentNode =>childNodes 로 접근해야 합니다.

function toggleDisplay(elem)
{
var elem = elem.parentNode.childNodes;
for(i = 0; i < elem.length; i++)
{
if(elem[i].tagName == "BLOCKQUOTE")
{
if(elem[i].style.display == "")
{
elem[i].style.display = "none";
}
else
{
elem[i].style.display = "";
}
}
}
}
파일로 첨부 해주시면감사.ㅋㅋ
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
11-10-25 조회 2,493
11-10-18 조회 4,024
11-10-18 조회 2,401
11-10-15 조회 3,620
11-10-10 조회 2,674
11-10-02 조회 2,592
11-09-28 조회 2,406
11-09-24 조회 2,491
11-09-22 조회 2,391
11-09-05 조회 2,876
11-08-31 조회 2,253
11-08-31 조회 2,562
11-08-31 조회 2,418
11-08-29 조회 2,965
11-08-28 조회 2,461
11-08-25 조회 2,512
11-08-17 조회 2,229
11-08-16 조회 2,464
11-08-11 조회 2,917
11-08-07 조회 2,631
11-08-03 조회 2,341
11-07-22 조회 2,084
11-07-12 조회 3,303
11-06-27 조회 2,087
11-06-01 조회 1,752
11-05-17 조회 2,538
11-05-01 조회 2,609
11-04-28 조회 2,897
11-04-28 조회 2,946
11-04-13 조회 2,605
11-03-27 조회 2,728
11-03-27 조회 2,604
11-03-14 조회 2,019
11-03-02 조회 2,341
11-03-02 조회 2,573
11-02-27 조회 3,000
11-02-23 조회 2,380
11-02-19 조회 2,521
11-02-14 조회 4,136
11-02-03 조회 2,929
11-01-24 조회 3,872
11-01-04 조회 2,403
10-12-08 조회 5,413
10-11-15 조회 2,423
10-11-14 조회 2,597
10-11-14 조회 3,614
10-10-29 조회 3,689
10-10-19 조회 2,701
10-10-07 조회 2,528
10-10-05 조회 4,446
10-09-18 조회 2,744
10-09-18 조회 2,482
10-09-17 조회 4,890
10-09-15 조회 2,828
10-09-15 조회 2,353
10-09-15 조회 2,846
10-09-15 조회 2,675
10-09-11 조회 4,000
10-09-11 조회 2,508
10-09-11 조회 2,545
10-09-07 조회 3,821
10-09-07 조회 3,356
10-08-29 조회 2,816
10-07-01 조회 3,066
10-06-30 조회 2,470
10-06-30 조회 2,652
10-06-30 조회 3,005
10-06-13 조회 2,041
10-04-15 조회 3,212
10-04-04 조회 3,444
10-02-23 조회 3,545
10-02-09 조회 3,142
10-01-25 조회 2,651
10-01-25 조회 2,750
09-12-27 조회 4,396
09-11-23 조회 3,619
09-11-20 조회 4,852
09-08-30 조회 3,051
09-08-30 조회 3,048
09-08-12 조회 3,015
09-07-22 조회 4,077
09-07-22 조회 4,723
09-07-15 조회 5,891
09-07-11 조회 2,968
09-06-17 조회 2,711
09-06-15 조회 2,997
09-05-29 조회 3,276
09-05-11 조회 5,913
09-05-08 조회 2,670
09-04-30 조회 3,786
09-04-17 조회 3,103
09-04-04 조회 3,286
09-03-05 조회 3,671
09-02-09 조회 3,638
09-02-03 조회 6,144
08-12-27 조회 3,208
08-12-20 조회 4,298
08-11-21 조회 5,258
08-11-14 조회 2,825
08-11-03 조회 3,290