-2

単語リンクのリストがあり、クリックするとさまざまな段落を折りたたむことができます。このコードが機能しない理由を誰かが理解するのを手伝ってくれますか?

<script>
    $(document).ready(function(){
        $("#origins").click(function(){
            $("li").each(function(){
                $("#"+$(this).text()+"Content").animate({height:'0', opacity:'0'}, 500);
            });
        });
    });
</script>

編集: 関連する HTML を追加

<body>
    <h1 class='title'>Electronic Music: London</h1>
    <ul>
        <li><a id='Origins'  href="#">Origins</a></li>
        <li><a id='Arrival'  href="#">Arrival</a></li>
        <li><a id='Clubs'    href="#">Clubs</a></li>
        <li><a id='Labels'   href="#">Labels</a></li>
        <li><a id='Examples' href="#">Examples</a></li>
        <li><a id='Credits' href="#">Credits</a></li>
    </ul>

    <p id='welcome' style='text-align:center;'>
        <br>
        Welcome!  Please click on any of the topics above to learn more.
    </p>

    <p id='originsContent'>
        Lorem ipsum dolor sit amet....
    </p>
</body>
4

2 に答える 2

1

このコードを試してください:

$(document).ready(function(){
    $('li').click(function(){
        $("#"+$(this).text().toLowerCase()+"Content").animate({height:'0', opacity:'0'}, 500);
    });
});

たとえば、変換する toLowerCase() メソッドを追加し、Originsコードoriginsの構造を少し変更します。

于 2013-07-20T14:36:58.770 に答える