0

私はULをスライドトグルしようとしています。しかし、私は立ち往生しました。

これが私の質問です：

これらのコードは機能しています:

    <div class="splitleft" onclick="toggle_item(b)">
        <?php echo $admin_logs ?>
        <ul class="menu" id="b">
            <li><a href="index.php?content=admin&page=show_logs_all"><?php echo $admin_logs_desc ?></a></li>
            <li><a href="index.php?content=admin&page=show_logs_player"><?php echo $admin_watch_players ?></a></li>
            <li><a href="index.php?content=admin&page=show_logs_admins"><?php echo $admin_watch_admins ?></a></li>
        </ul>
    </div>
<script>function toggle_item(e){$(e).slideToggle();}</script>

しかし、私はそれをしたくありません。私はこのようにしたい：

<ul class="menu" onclick="toggle_item(b)" id="b">
    <li><a href="index.php?content=admin&page=show_logs_all"><?php echo $admin_logs_desc ?></a></li>
    <li><a href="index.php?content=admin&page=show_logs_player"><?php echo $admin_watch_players ?></a></li>
    <li><a href="index.php?content=admin&page=show_logs_admins"><?php echo $admin_watch_admins ?></a></li>
</ul>

誰かが私を助けることができます:)私はjsが本当に苦手です..

4

2 に答える 2

1

jQueryを使用しています。これには簡単な方法があります。<head>タグにこれを追加します<script>：

jQuery(function($){
    $('#b').click(function( jqEvt ) {
        $(this).find('li').slideToggle();
    });
});

細かい部分をさらに説明します。

jQuery(function($){...})の短く確実な形式です$(document).ready(function(){...})。関数に渡されるパラメーターは jQuery オブジェクトです。$このバージョンでは、別の変数が使用された場合に jQuery フレームワークを使用することが保証されます。

$('#b')これを理解するのに十分な知識があることを願っています。そうでない場合、これは、ソートされていないリスト要素を jQuery に選択させるセレクタです。実際には、 attribute を持つ最後の要素が選択されますid="b"が、1 つしかないはずです。それ以外はすべて不正な HTML になります。

.click(function( jqEvt ) {...})クリック イベントのイベント リスナーを選択した要素にバインドします。jqEvtパラメータは、標準化されたイベント オブジェクトです。

$(this).children().slideToggle();thisコンテキストオブジェクトは私の知る限り と同一であるため、タグjqEvt.targetになります。divタグを折りたたむように求めているので、 .find()メソッドliでタグを選択できます。後続のすべての要素を照合するには、別のセレクターが必要です。

于 2013-05-04T19:42:36.857 に答える