チェックボックスはいつもチェックされていませんか？

Question

次のコードは、呼び出し元のノードにチェックボックスとラベルを追加します。
私の質問は、label.click関数にあります。ラベルをクリックするたびに、一致するチェックボックスの状態を変更したいと思います。しかし、チェックボックスは常にチェックされなくなります。 デバッグの目的で、私は常に明示的にcheckedに設定しました。

Firebugでコードをステップ実行すると、チェックボックスがオンになっていることが確認され、機能を終了すると再びチェックが外されます。

アイデア？

jQuery.fn.AddEndOrStartWith = function(selected, id, action) { 
    var checkBox = $('<input type="checkbox"></input>'); 
    checkBox.attr("id", id + action); 
    checkBox.addClass(action + "CheckBox"); 
    checkBox.attr("for", id); 

    var label = $('<label></label>'); 
    label.attr("for", id + action); 

    if (selected) { 
     checkBox.attr("checked", "checked"); 
     label.addClass("lockerClosed"); 
    } else { 
     label.addClass("lockerOpen"); 
    } 

    $(this).append(label); 
    $(this).append(checkBox); 

    label.click(function() { 
     /*alert(checkBox.attr("checked"));*/ 
     checkBox.attr("checked", "checked"); 
     /*return true;*/ 
     /*alert(checkBox.attr("checked"));*/ 
    }); 
} 

Answer 1

ラベルクリックハンドラのデフォルトアクションを防止する必要があります。これはそれを行うべきだと思う：

label.click(function() { 
    checkBox.attr("checked", "checked"); 
    return false; 
}); 

何が起こっていることはあなたのラベルが正しくチェックボックスを参照そのforで設定されているので、それをクリックするデフォルトのアクションは、チェックボックスをトグルすることであるということです。

あなたがクリックハンドラでやっていることがあれば、クリックハンドラを使うことさえできないと思います。しかし、私はそれが事実であるかどうかは分かりません。 、チェックボックスのIDを設定するラベルに属性に設定し、その後正を返すときに、私はどうやら..私はそれを自分自身を発見し、数分以内にSO、その後に

をそれを置く検索の2つの午後の後

Answer 2

クリック関数上で何とかそれをfalseにします。 click関数をfalseにすると、HTMLを無効にせずにサイクルを壊します。

決勝コード：

jQuery.fn.AddEndOrStartWith = function(selected, id, action) { 
    var checkBox = $('<input type="checkbox"></input>'); 
    checkBox.attr("id", id + action); 
    checkBox.addClass(action + "CheckBox"); 

    var label = $('<label></label>'); 
    label.attr("for", id + action); 

    if (selected) { 
     checkBox.attr("checked", "checked"); 
     label.addClass("lockerClosed"); 
    } else { 
     label.addClass("lockerOpen"); 
    } 

    $(this).append(label); 
    $(this).append(checkBox); 

    label.click(function() { 
     checkBox.attr("checked", !checkBox.attr("checked")); 
     return false; 
    }); 
}