jqueryをクリックすると属性「チェック済み」を追加します

Question

クリック時にチェックボックスに「チェックされた」属性を追加する方法を見つけようとしています。これをやりたい理由は、チェックボックスをチェックした場合です。ローカルストレージにHTMLとして保存することができます。そのため、ページがリフレッシュすると、チェックボックスがチェックされていることがわかります。今のところ、私がそれをチェックオフすると、それは親をフェードしますが、私が保存してリロードすると、それは色あせたままですが、チェックボックスはチェックされていません。

$（this）.attr（ 'checked'）を実行してみました。しかし、チェック済みを追加したくないようです。

編集：コメントを読んだ後、私は明確ではなかったようです。私のデフォルトの入力タグは次のとおりです。

<input type="checkbox" class="done">

トップが必要なので、チェックボックスをクリックすると、その最後に「チェック」が追加されます。元：

<input type="checkbox" class="done" checked>

これを行う必要があるので、HTMLをローカルストレージに保存すると、ロードされると、チェックボックスがチェックされたままになります。

$(".done").live("click", function(){
if($(this).parent().find('.editor').is(':visible') ) {
var editvar = $(this).parent().find('input[name="tester"]').val();
$(this).parent().find('.editor').fadeOut('slow');
$(this).parent().find('.content').text(editvar);
$(this).parent().find('.content').fadeIn('slow');
}
if ($(this).is(':checked')) {
$(this).parent().fadeTo('slow', 0.5);
$(this).attr('checked'); //This line
}else{

$(this).parent().fadeTo('slow', 1);
$(this).removeAttr('checked');
}
});

Answer 1

これは、属性の使用が実際に適切であるまれな機会の1つであるようです。 jQuery's attr() ほとんどの場合（これを含む）、実際には属性ではなくプロパティを設定し、その名前の選択がやや愚かに見えるため、メソッドは役に立ちません。 更新：jQuery 1.6.1以降、 状況はわずかに変化しました]

IEにはDOMにいくつかの問題があります setAttribute 方法ですが、この場合は大丈夫です：

this.setAttribute("checked", "checked");

IEでは、これにより常にチェックボックスがチェックされます。他のブラウザでは、ユーザーが既にチェックボックスをチェックしてチェックしている場合、属性の設定は目に見える効果がありません。したがって、チェックボックスがチェックされていることを保証する場合は、 checked 属性、あなたはを設定する必要があります checked プロパティも同様です：

this.setAttribute("checked", "checked");
this.checked = true;

チェックボックスを外して属性を削除するには、次のことを実行します。

this.setAttribute("checked", ""); // For IE
this.removeAttribute("checked"); // For other browsers
this.checked = false;

Answer 2

$( this ).attr( 'checked', 'checked' )

ただ attr( 'checked' ) $（this）のchecked属性の値を返します。それを設定するには、その2番目の引数が必要です。に基づく <input type="checkbox" checked="checked" />

編集：

コメントに基づいて、より適切な操作は次のとおりです。

$( this ).attr( 'checked', true )

そして、より適切かつ効率的なストレートJavaScriptメソッド：

this.checked = true;

ありがとう @アンディe そのために。

Answer 3

もしも .attr() あなたのために働いていません（特に連続してボックスをチェックしてチェックするとき）、使用してください .prop() それ以外の .attr().

Answer 4

このコードを使用します

var sid = $(this);
sid.attr('checked','checked');