0

Estou tentando dar disabled em todos os botões com um mesmo nome, porém ele não funciona, o que estou fazendo de errado?

//HTML BOTÃO QUE EU QUERO DESATIVAR
<button class="teclado" id="Q" name="nameTeclado" onClick="forca(this.id);">Q</button>
//HTML BOTÃO QUE ESTOU USANDO PARA DESATIVAR
<button onClick="teste();">teste</button>
//JS
function teste() {
document.getElementsByName("nameTeclado").disabled = "true";
}

São muitos botões que eu preciso desativar de uma vez, então não posso fazer com get.elementById (que no caso funciona)

2 Respostas 2

0

O problema ocorre porque quando você busca os elementos pelo name podem existir vários elementos com o mesmoname(o que é o seu caso), então ogetElementsByNameirá retornar vários elementos. Para setar o disabled de todos os elementos, você precisará percorrer esse array setando o atributodisabledpratrue` dessa forma:

//aqui você pega todos os elementos do mesmo nome e salva numa variável
var botoes = document.getElementsByName("nameTeclado");

//como o getElementsByName retorna uma NodeList e não ArrayList, precisa transformar em Array pra conseguir usar o forEach 
var botoesList = Array.prototype.slice.call(botoes);

//aqui você percorre o array botoes e seta o disabled para true
botoesList.forEach(function(element) {
    element.disabled = true;
});

Fontes:

Documentação HTML DOM getElementsByName()

Documentação Array.prototype.forEach()

2
  • Seu código não vai funcionar Juliano, true não é uma string.
    – LeAndrade
    Commented 15/06/2018 às 3:10
  • 1
    Sim, já corrigi esse detalhe. Agora testei aqui e funcionou dessa forma, estava faltando transformar o botoes em um objeto Array também :)
    – echojn
    Commented 15/06/2018 às 3:13
0

Todos os botões com um mesmo nome

function teste() {
   //quantidade de elementos com name = nameTeclado
   var x = document.getElementsByName("nameTeclado").length;
   for(i=0;i<x;i++){
     document.getElementsByName("nameTeclado")[i].disabled = "true";
   }
}
<button class="teclado" id="Q1" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q2" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q3" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q4" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q5" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q6" name="nameTeclado" onClick="forca(this.id);">Q</button>


<button onClick="teste();">teste</button>

coloquei ID diferentes porque IDs são únicos e além do mais vai ter que passar id diferente no onClick="forca(this.id)

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .