Adicionar atributo 'verificado' no clique no jQuery

Question

Eu tenho tentado descobrir como adicionar o atributo "verificado" a uma caixa de seleção no clique. O motivo pelo qual quero fazer isso é, se eu marcar uma caixa de seleção; Eu posso ter meu armazenamento local, exceto isso como o HTML; portanto, quando a página atualiza, ele percebe que a caixa de seleção é verificada. A partir de agora, se eu marcar, ele desaparece o pai, mas se eu salvar e recarregar, ele permanece desbotado, mas a caixa de seleção não será controlada.

Eu tentei fazer $ (isso) .attr ('verificado'); Mas não parece querer adicionar verificado.

EDIT: Depois de ler comentários, parece que eu não estava sendo claro. Minha tag de entrada padrão é:

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

Eu preciso que seja o topo. Quando clico na caixa de seleção, ele adiciona "verificado" ao final disso. Ex:

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

Preciso fazer isso para que, quando salvo o HTML no armazenamento local, quando ele carrega, ele renderiza a caixa de seleção, conforme verificado.

$(".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

Parece que esta é uma das raras ocasiões nas quais o uso de um atributo é realmente apropriado. JQuery's attr() O método não o ajudará porque, na maioria dos casos (incluindo isso), ele realmente define uma propriedade, não um atributo, fazendo com que a escolha de seu nome pareça um pouco tola. Atualização: desde o jQuery 1.6.1, A situação mudou um pouco]

Ou seja, tem alguns problemas com o DOM setAttribute Método, mas neste caso deve ficar bem:

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

No IE, isso sempre fará a caixa de seleção verificada. Em outros navegadores, se o usuário já tiver verificado e desmarcado a caixa de seleção, a configuração do atributo não terá efeito visível. Portanto, se você deseja garantir que a caixa de seleção seja verificada, além de ter o checked atributo, você precisa definir o checked propriedade também:

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

Para desmarcar a caixa de seleção e remover o atributo, faça o seguinte:

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

Answer 2

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

apenas attr( 'checked' ) retornará o valor do atributo verificado de $ (este). Para defini -lo, você precisa desse segundo argumento. Baseado em <input type="checkbox" checked="checked" />

Editar:

Com base nos comentários, uma manipulação mais apropriada seria:

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

E um método JavaScript reto, mais apropriado e eficiente:

this.checked = true;

Obrigado @Andy e por isso.

Answer 3

Se .attr() não está funcionando para você (especialmente quando verificando e desmarcando caixas em sucessão), use .prop() ao invés de .attr().

Answer 4

Use este código

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