botão de opção definir jQuery

134

Estou tentando definir um botão de opção. Quero defini-lo usando o valor ou o ID.

Isto é o que eu tentei.

$('input:radio[name=cols]'+" #"+newcol).attr('checked',true);

newcol é o ID do botão de opção.

Talvez uma pequena edição esteja em ordem.

Existem dois conjuntos de caixas de rádio, uma com colunas e outra com linhas. Então eu vejo o ponto em não usar id's. Foi mal. Então, eu tenho como um exemplo:

<input type="radio" name="rows" class="listOfCols" 
   style="width: 50%; " value="Site"></input>

e

<input type="radio" name="cols" class="listOfCols" 
   style="width: 50%; "  value="Site"></input>

com o ID removido e preciso definir o correto.

jquery radio-button

— mike628
fonte

5

possível duplicata como opção de rádio conjunto verificado onload com jQuery

— Chris Pratt

196

Seu seletor procura o descendente de um input:radio[name=cols]elemento com o ID newcol(bem, o valor dessa variável).

Tente fazer isso (já que você seleciona por ID):

$('#' + newcol).prop('checked',true);

Aqui está uma demonstração: http://jsfiddle.net/jasper/n8CdM/1/

Além disso, a partir do jQuery 1.6, o método preferido de alterar uma propriedade é .prop(): http://api.jquery.com/prop

— Jaspe
fonte

5

+1 para propvs attr. attrdescontinuado por propriedades e não funciona mais no jQuery 2.0))

— gavenkoa 20/12/2013

87

Encontrei a resposta aqui:
https://web.archive.org/web/20160421163524/http://vijayt.com/Post/Set-RadioButton-value-using-jQuery

Basicamente, se você quiser verificar um botão de opção, DEVE passar o valor como uma matriz:

$('input:radio[name=cols]').val(['Site']);
$('input:radio[name=rows]').val(['Site']);

— Chococroc
fonte

Olá, Link que não possui conteúdo sugerido. Por que vocês continuam rejeitando minha edição para remover o link? Não contém nada sobre o assunto.

— Menu # Ishan #

@MenukaIshan, o ponto é: dar crédito. O link está disponível em web.archive.org, e o cara que o escreveu pela primeira vez e de quem eu recebo a idéia da resposta deve receber seu crédito. Não remova o link e, se você quiser ver a postagem original, copie e cole o link (não sei por que ele está acessando a página antiga, e não o web.archive.org)

— Chococroc

2

@Chococroc Você não configurou o Markdown da pergunta corretamente. Eu vi a versão do arquivo da Web e a vinculei corretamente. Após a revisão, ele será vinculado corretamente ao site.

— Menu9 Ishan #

2

Parece que esta deve ser a resposta aceita, uma vez que é a solução mencionado nos docs jQuery

— plong0

15

No seu seletor, você parece estar tentando buscar algum elemento aninhado do seu botão de opção com um determinado ID. Se você quiser verificar um botão de opção, selecione esse botão no seletor e não outra coisa:

$('input:radio[name="cols"]').attr('checked', 'checked');

Isso pressupõe que você tenha o seguinte botão de opção na sua marcação:

<input type="radio" name="cols" value="1" />

Se o seu botão de opção tivesse um ID:

<input type="radio" name="cols" value="1" id="myradio" />

você poderia usar diretamente um seletor de identificação:

$('#myradio').attr('checked', 'checked');

— Darin Dimitrov
fonte

Se houver vários rádios com o colsnome, $('input:radio[name="cols"]').attr('checked', 'checked');você selecionará apenas o último. Ele executará o código em cada um, mas sempre que você definir a checkedpropriedade, o elemento definido anteriormente será desabilitado. Aqui está uma demonstração: jsfiddle.net/jasper/n8CdM/2

— Jasper

@ Jasper, sim, isso é verdade. É por isso que sugeri usar um seletor de identificação.

— Darin Dimitrov

12

Você pode tentar o seguinte código:

$("input[name=cols][value=" + value + "]").attr('checked', 'checked');

Isso definirá o atributo verificado para as colunas de rádio e o valor conforme especificado.

— punita.gosar
fonte

1

...the most important concept to remember about the checked attribute is that it does not correspond to the checked property.

Fonte: api.jquery.com/attr

— Jasper

10

Por que você precisa 'input:radio[name=cols]'. Não conhece seu html, mas assumindo que os IDs são únicos, você pode simplesmente fazer isso.

$('#'+newcol).prop('checked', true);

— elclanrs
fonte

6

Tente o seguinte:

$("#" + newcol).attr("checked", "checked");

Eu tive problemas com attr("checked", true), então eu costumo usar o acima.

Além disso, se você tiver o ID, não precisará desse outro material para a seleção. Um ID é único.

— O Urso Awnry
fonte

1

prop é melhor do que attr para coisas como esta

— ROZZA

attr foi removido no jQuery 1.9+ Use prop.

— Mike_Laird

Você está certo, mas no final das contas depende da sua situação específica. Se seu código estará sempre em execução com o jQuery 1.6+, prop é o caminho a seguir. Mas se o seu código pode estar sendo executado em versões mais antigas, a solução não é tão simples. Por exemplo, mantenho o plug-in jQuery PickList e suportamos o jQuery 1.4+, portanto, simplesmente usar prop não é uma opção. Este é um ingresso aberto, portanto, se você tiver alguma sugestão elegante, eu adoraria ouvi-las; Ainda não tive tempo de fazer a pesquisa ainda.

— The Awnry Bear

O problema é que, mesmo que sua solução seja mais compatível com versões anteriores, simplesmente não funciona neste caso: Selecione A, ele receberá um novo checked="checked"atributo e o navegador mostrará como marcado, depois selecione B e o mesmo acontecerá. Agora, quando você selecionar A novamente, ele já terá checked="checked"atributo e nada será alterado. Como um efeito colateral de que B ainda vai ser seleccionado, não A.

— Kyborek

2

Como newcolé o ID do botão de opção, você pode simplesmente usá-lo como abaixo.

$("#"+newcol).attr('checked',true);

— Selvakumar Arumugam
fonte

2

O uso .filter()também funciona e é flexível para identificação, valor e nome:

$('input[name="cols"]').filter("[value='Site']").attr('checked', true);

(visto neste blog )

— dhc
fonte

1

Eu acredito que esta é uma resposta igualmente válida, mas deve usar o método prop (): $ ('input [name = "cols"]'). Filter ("[value = 'Site']"). Prop ('marcado ', verdade);. O usuário deseja definir por "valor ou id". Pode haver momentos em que você não deseja definir valores de ID para todas as opções de rádio, portanto, obter o nome e filtrar o valor é útil.

— Zac Imboden

2

Combinando respostas anteriores:

$('input[name="cols"]').filter("[value='Site']").click();

— Graham Laight
fonte

0

Você pode simplesmente usar:

$("input[name='cols']").click();

— Markoj
fonte

0

A resposta escolhida funciona neste caso.

Mas a pergunta era sobre encontrar o elemento com base no grupo de rádio e no ID dinâmico, e a resposta também pode deixar o botão de opção exibido inalterado.

Essa linha seleciona exatamente o que foi solicitado enquanto mostra a alteração na tela também.

$('input:radio[name=cols][id='+ newcol +']').click();

— mim_
fonte