0

動的に作成されたスタイル メニューがあり、どれがクリック<ul>されたかを知りたいです。<li>

何度も試みた後、どれ<li>がクリックされたかを認識させることができません。「クリック時」をそれぞれ<li>とに付けてみました<ul>。また、Lynda.com で 2 つの Javascript と 1 つの jQuery コースを受講しました。

私の最良の結果は、Javascript を使用して空のアラート ボックスを取得することです。それで、3日間のイライラした後、私は再び助けを求めてここに来ました.

<script>$(".qmli").on('click', function() { 
        alert($(this).text());
    });
</script>


<ul id="qm0" class="qmmc">
    <li><a class="qm-startopen qmparent" href="javascript:void(0)">Top menu</a>
        <ul>
            <li><a class="qmparent" href="javascript:void(0)">Plants</a>
                <ul>
                    <li>class='qmli" <a href="javascript:void(0)">Flowers</a></li>
                    <li>class='qmli" <a href="javascript:void(0)">Trees</a></li>
                </ul>
            </li>
            <li><a class="qmparent" href="javascript:void(0)">Animals</a>
                <ul>
                    <li>class='qmli" <a href="javascript:void(0)">Lions</a></li>
                    <li>class='qmli" <a href="javascript:void(0)">Tigers</a></li>
                </ul>
            </li>
    <li>class='qmli" <a href="#">Overview</a></li>
    <li>class='qmli" <a href="javascript:void(0)">Publicity</a></li>
        </ul>
    </li>
    <li class="qmclear">&nbsp;</li>
</ul>
4

4 に答える 4

0

問題

クラスを修正して を削除することはjavascript:void(0)最初のステップとしては適切ですが、jquery を $(document).ready() 関数でラップすることも忘れないでください (一番下に添付した参考文献を読んでください)。

私はあなたの html と jquery を修正し、マークアップとコードのすべての問題を修正することで、あなたが達成しようとしていた結果を生み出しました。


コード

html:

<ul id="qm0" class="qmmc">
    <li><a class="qm-startopen qmparent" href="#">Top menu</a>
        <ul>
            <li><a class="qmparent" href="#">Plants</a>
                <ul>
                    <li class="qmli"><a href="#">Flowers</a></li>
                    <li class="qmli"><a href="#">Trees</a></li>
                </ul>
            </li>
            <li><a class="qmparent" href="#">Animals</a>
                <ul>
                    <li class="qmli"><a href="#">Lions</a></li>
                    <li class="qmli"> <a href="#">Tigers</a></li>
                </ul>
            </li>
    <li class="qmli"><a href="#">Overview</a></li>
    <li class="qmli"> <a href="#">Publicity</a></li>
        </ul>
    </li>
    <li class="qmclear">&nbsp;</li>
</ul>​

jquery:

$(document).ready(function() {

    $(".qmli").click(function() {

        alert($(this).text())
        preventDefault()
    });

});​

参考文献

于 2012-05-02T01:57:43.450 に答える
0

2つの間違い

1.そう<li class='qmli'>ではない<li>class='qmli'

2.スクリプトをマークアップの上に置くので、ready() ハンドラーでラップする必要があります

<script>
$(document).ready(){
$(".qmli").on('click', function() { 
        alert($(this).text());
    });
    });

</script>
于 2012-05-02T01:57:56.497 に答える