1

私はこれを持っています。

$(function()
 {
    $("#test_div").toggle(
        function() { $("#test_div").css({"background-color": "#00ff00"}); },
        function() { $("#test_div").css({"background-color": "#0000ff"}); }
    );
});

ドキュメントによると、div をクリックするたびに、toggle の関数が別の方法で実行されるはずです。最初に最初の引数の関数が実行され、2 回目のクリック後に 2 番目の引数の関数が実行されます。

ただし、divは非表示になります。私は何を間違っていますか？

4

4 に答える 4

2

jQuery 1.9.0 以降を使用している場合、トグル イベントが削除されました。toggleClass() を試してください。

于 2013-02-06T11:46:22.640 に答える
2

toggleClass()を使用します。必要な背景でクラスを作成し、それを切り替えます..シンプルで読みやすい..:)

これを試して

Jクエリ

 $("#test_div").click(function(){
     $(this).toggleClass("newClass");
 });

CSS

 #test_div
 {
   background-color: #ff0000;
   width: 100px;
   height: 100px;
 }
 #test_div.newClass
 {
   background-color: #0000ff;
 }

ここでフィドル

于 2013-02-06T11:52:29.133 に答える
0

こんな感じで使ってみてください

$(function()
 {
    $("#test_div").click(
function() { 
            if ($("#test_div").css("background-color") == "rgb(0, 255, 0)")
                $("#test_div").css({"background-color": "#0000ff"});
            else
                $("#test_div").css({"background-color": "#00ff00"});
            }
    );
});

デモを見る

于 2013-02-06T11:48:39.320 に答える
0

この機能は.toggle、正当な理由により jQuery 1.9 で削除されました。おそらく次のように、内部的に切り替えたい項目の状態を維持するのはかなり簡単です。

$("#test_div").on('click', function () {
    var $this = $(this);
    if ($this.css('background-color') == '#00ff00') {
        $this.css('background-color', '#0000ff');
    }
    else {
        $this.css('background-color', '#00ff00');
    }
});

.dataそれがうまくいかない場合は、「toggleState」のようなパラメーターを使用できます.css。

于 2013-02-06T11:47:07.180 に答える