0

次のjqueryコードが指定されています：

$('#firstbox ul.checkboxlist input[type="checkbox"]').live('click',function(){
    $(this).parents('li').remove().clone().prependTo('#secondbox ul.checkboxlist').animate({backgroundColor: '#FAEA96'},100, function(){$(this).animate({backgroundColor: '#FFFFFF'},800);});
});

チェックボックスをクリックすると、li が取り除かれ、2 番目のボックスに入れられます。IE では正常に動作します。また、ラベルのテキストをクリックしても問題なく動作します。ただし、Firefox のチェックボックスを直接クリックすると、Firefox の速度が約 10/15 秒間低下し、次のエラーがログに記録されます。

警告: rgb() で数値またはパーセンテージが予期されていましたが、'NaN' が見つかりました。「背景色」の値を解析中にエラーが発生しました。宣言は下されました。行: 0

Firebug が返す再帰が多すぎます。

ラベルをクリックすると、実際のチェックボックスをクリックしたときと異なるのはなぜですか?

4

2 に答える 2

1

jQuery UI を使用していますか? 背景色をアニメーション化する場合は、少なくともコア エフェクトを使用する必要があります。また、 clone() を使用せずに試しましたか? 前のリストから要素を削除しているので、それらを複製する必要はありません。ハイライト() 効果を使用することもできます。これは、あなたが行っていることのようです。

これらのいずれも、FF が異なる方法で処理しているように見える理由についての正確な質問には対応していませんが、そのうちの 1 つが問題を解決することを願っています。

于 2009-12-11T11:59:31.967 に答える
0

メソッド「remove」のjQueryドキュメントによると、コース「appendTo」または他のメソッドを使用している場合、このメソッドは必要ありません。「クローン」を使用する必要はありませんが、私の意見では、コードはこのようになっている可能性があります。ある時点で、二重引用符と一重引用符（"input[type='checkbox']"）に問題が発生したため、このように引用符を使用します。

remove（）の情報

$("#firstbox ul.checkboxlist").find("input[type='checkbox']").live("click",function(){

    $(this)
        .parents("li")
        .prependTo("#secondbox ul.checkboxlist")
        .animate({backgroundColor: "#FAEA96"},100, function(){
            $(this).animate({backgroundColor: "#FFFFFF"}, 800);
        });

});

編集：イベントの削除をクリックするには

$("#firstbox ul.checkboxlist").find("input[type='checkbox']").live("click",function myEventClick(){

    $(this)
        .unbind("click", myEventClick)
        .parents("li")
        .prependTo("#secondbox ul.checkboxlist")
        .animate({backgroundColor: "#FAEA96"},100, function(){
            $(this).animate({backgroundColor: "#FFFFFF"}, 800);
        });

});
于 2009-12-11T13:17:07.690 に答える