0

メニューのメニュー項目をクリックすると、jquery slideUp/slideDown を作成しようとしています。display 属性の値に基づいて条件を実行することでこれができると思ったのですが、何らかの理由で機能しません。属性値を正しく取得していないはずです。何が間違っていますか?

$(document).ready(function() {
$("#left-help-menu li").click(function() {
    if($(this).children().attr('display') == 'none')
    {   
        $(this).children().css('display', 'block');
    }
    else if($(this).children().attr('display') == 'block')
    {
        $(this).children().css('display', 'none');
    }
});
})
4

2 に答える 2

5

displayhtml-object の属性ではありません。次の行の css で設定している値を確認する必要があります。

if($(this).children().css('display') == 'none') {   
    $(this).children().css('display', 'block');
}

さらに良いことに:

$(document).ready(function() {
    $("#left-help-menu li").click(function() {
        $(this).children().toggle();
    });
})

編集：明確にするためにコメントと変数を含む同じコード

$(document).ready(function() {

    // When all the html has been loaded we locate all the <li> tags
    var $lis = $("#left-help-menu li");

    // After that we bind the click event on them to an anonymous function
    $lis.click(function() {

        // Whenever a <li> is clicked this code will run.

        // First, lets get a hold of the clicked element
        var $li = $(this);

        // Now, find all the elements in that <li>
        $children = $li.children();

        // Lastly, lets hide or show them
        $children.toggle();
    });
})

注: これは実際に<li>「スライド」の内容を上下させるわけではありません。必要に応じて、メソッドを使用できます$.slideToggle()。

于 2012-11-02T13:36:25.823 に答える
0

display属性ではなくスタイルです。.attr()に変更.css()

これを試して、

$(document).ready(function() {
  $("#left-help-menu li").click(function() {
    if($(this).children().css('display') == 'none')
    {   
        $(this).children().css('display', 'block');
    }
    else if($(this).children().css('display') == 'block')
    {
        $(this).children().css('display', 'none');
    }
  });
})
于 2012-11-02T13:36:45.607 に答える