jquery - jQuery チェーニング css background-color、一度しか機能しません

Question

jQuery を使用して段落の背景色の変更を連鎖させようとしています。次のコードは最初のクリックで機能します: 色を緑に変更し、非表示にしてから表示し、次に色を黄色に変更します。

2 回目のクリックで、色が緑に変わりますが、それ以外は何も起こりません。それ以上クリックしても何も起こりません。どうしたの？

$( "#p1" ).click(function( event ) {
$("#p1").css("background-color","green").slideUp(2000).slideDown(2000).queue( 
function() { $("#p1").css("background-color", "yellow"); }
);
});

Answer 1

.queueここで使用する必要はありません。これで問題ありません。

$("#p1").click(function(event) {
  $("#p1").css("background-color", "green").slideUp(2000).slideDown(2000, function() {
    $("#p1").css("background-color", "yellow");
  });
});

または、使用します.clearQueue

$("#p1").click(function(event) {
  $("#p1").clearQueue().css("background-color", "green").slideUp(2000).slideDown(2000).queue(
    function() {
      $("#p1").css("background-color", "yellow");
    });
});