1

問題
jQueryの.toggle（）メソッドを使用してボタンがクリックされたときに2つの関数を切り替えようとしていますが、DOMの準備ができるとすぐにボタン自体が消えます。

コード

$(document).ready(function() {

    $("#panel").css({"height": "0%", "bottom": "0"});

/*
    var already_clicked = false;
    $("button").on("click", function() {
        if (already_clicked) {
            $("#panel").animate({"height": "0%"}, 500);
            already_clicked = false;
        } else {
            $("#panel").animate({"height": "100%"}, 500);
            already_clicked = true;
        }
    });
*/

    $("button").toggle(function() {
        $("#panel").animate({"height": "100%"}, 500);
    }, function() {
        $("#panel").animate({"height": "0%"}, 500);
    });

});

マークアップ

<body>
    <div id="panel"></div>
    <button>Click me</button>
</body>

注：コメントブロックの解決策は意図したとおりに機能しますが、.toggle（）が機能しない理由がわかりません。

4

2 に答える 2

5

これがあなたが望むものであるならば、私は使用しないでください、しかし.slideToggle：

$("button").click(function() {
    $("#panel").slideToggle(500);
});

あなたが求めているものでしょうか？

于 2013-01-24T08:57:58.467 に答える
2

jQuery 1.9を使用している場合は.toggle、そのようには機能しません。引数として2つの関数を使用するバージョンは、1.8で非推奨になり、1.9で削除されました。

http://api.jquery.com/toggle-event/を参照してください

于 2013-01-24T08:58:17.510 に答える