25

クリック時にチェックボックスに「チェック済み」の属性を追加する方法を見つけようとしています。これを実行したい理由は、チェックボックスをオフにした場合です。ローカルストレージにそれを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');
}
});
4

5 に答える 5

39

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

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

編集:

コメントに基づくと、より適切な操作は次のようになります。

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

そして、より適切で効率的な、まっすぐなjavascriptメソッド:

this.checked = true;

@AndyEに感謝します

于 2010-08-04T17:37:35.997 に答える
28

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

IE の DOMsetAttributeメソッドにはいくつか問題がありますが、この場合は問題ありません。

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;
于 2010-08-04T21:28:41.170 に答える