Obter o valor do nome do atributo <input>

134

Como obter o valor do nome do atributo de uma tag de entrada usando o jQuery. Por favor ajude.

<input name='xxxxx' value=1>
Kaartz
fonte

Respostas:

270

Dê um ID à sua entrada e use o attrmétodo:

var name = $("#id").attr("name");
djdd87
fonte
33

Use o attrmétodo do jQuery assim:

alert($('input').attr('name'));

Observe que você também pode usar attrpara definir os valores do atributo especificando o segundo argumento:

$('input').attr('name', 'new_name')
Sarfraz
fonte
18
var value_input = $("input[name*='xxxx']").val();
Laura Riera
fonte
Esta postagem está sendo sinalizada automaticamente como de baixa qualidade porque é um código curto / único. Você se importaria de expandi-lo adicionando algum texto para explicar como ele resolve o problema?
gung - Reintegrar Monica
2
Na verdade, não resolve o problema. O OP deseja obter o valor do nome; isso pressupõe que você já o conhece.
felwithe
16

Embora não haja como negar que o jQuery é uma ferramenta poderosa, é uma péssima idéia usá-lo para uma operação trivial como "obter o valor do atributo de um elemento".

A julgar pela resposta atual aceita, assumirei que você foi capaz de adicionar um atributo de ID ao seu elemento e usá-lo para selecioná-lo.

Com isso em mente, aqui estão dois pedaços de código. Primeiro, o código fornecido na resposta aceita:

$("#ID").attr("name");

E segundo, a versão do Vanilla JS :

document.getElementById('ID').getAttribute("name");

Meus resultados:

  • jQuery: 300k operações / segundo
  • JavaScript: 11.000k operações / segundo

Você pode testar por si mesmo aqui . A versão "plain JavaScript" é 35 vezes mais rápida versão que a versão do jQuery.

Agora, isso é apenas para uma operação, com o tempo você terá mais e mais coisas acontecendo no seu código. Talvez para algo particularmente avançado, a solução ideal "JavaScript puro" levaria um segundo para ser executada. A versão do jQuery pode levar 30 segundos a um minuto inteiro! Aquilo é enorme! As pessoas não vão se sentar por isso. Até o navegador fica entediado e oferece a opção de matar a página da Web por demorar muito!

Como eu disse, jQuery é uma ferramenta poderosa, mas deve não ser considerado a resposta para tudo .

Niet, o Escuro Absol
fonte
boa resposta, eu cruzei para que o javascript seja mais rápido que o jquery, certo?
Rijo 20/03
Você respondeu a essa pergunta 4 anos após a pergunta ser feita e não a abordou. A pessoa perguntou como fazer isso no jQuery. Cabe ao programador se deve usar jQuery ou Vanilla JS e está fora do âmbito da pergunta
Zachary Weixelbaum
JS de baunilha! ?? brincando, passei meia hora pesquisando o que é o hack Vanilla JS.
Basheer AL-MOMANI
Talvez o desenvolvedor não saiba. Eu estava ciente do fato de que estruturas como o jQuery causam alguma sobrecarga. Mas eu não esperava que a abrandar tais tarefas simples em fator 35 quando usando jQuery ...
Daniel
7

Você precisa escrever um seletor que selecione o correto <input>primeiro. Idealmente, você usa o ID do elemento $('#element_id'), falhando que o ID do contêiner $('#container_id input')ou a classe do elemento $('input.class_name').

Seu elemento não possui nenhum desses nem contexto, por isso é difícil dizer como selecioná-lo.

Depois de descobrir o seletor adequado, você usaria o método attr para acessar os atributos do elemento. Para obter o nome, você usaria o $(selector).attr('name')que retornaria (no seu exemplo) 'xxxxx'.

magro
fonte
5

Uma maneira melhor poderia ser usar 'this', leva qualquer que seja o nome do 'id' e o use. Contanto que você adicione o nome da classe chamado 'mytarget'.

Sempre que qualquer um dos campos com destino for alterado, ele exibirá uma caixa de alerta com o nome desse campo. Basta cortar e colar o script inteiro para que ele funcione!

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
 $('.mytarget').change(function() {
var name1 = $(this).attr("name");
alert(name1);
 });
});
</script>

Name: <input type="text" name="myname" id="myname" class="mytarget"><br />
Age: <input type="text" name="myage" id="myage" class="mytarget"><br />
Mikeys4u
fonte
1
var theName;

theName = $("input selector goes here").attr("name");
Paddy
fonte
1

usando value get input name

 $('input[value="1"]').attr('name');

usando id get input name

 $('input[class="id"]').attr('name');
   $('#id').attr('name');

usando classe get name da entrada

 $('input[value="classname"]').attr('name');
   $('.classname').attr('name');  //if classname have unique value
nirali
fonte
0

Se você estiver lidando com um único elemento, de preferência, use o idseletor conforme indicado na resposta GenericTypeTea e obtenha o nome como $("#id").attr("name");.

Mas se você quiser, como eu fiz quando encontrei essa pergunta, uma lista com todos os nomes de entrada de uma classe específica (no meu exemplo, uma lista com os nomes de todas as caixas de seleção desmarcadas da .selectable-checkboxclasse), você pode fazer algo como:

var listOfUnchecked = $('.selectable-checkbox:unchecked').toArray().map(x=>x.name);

ou

var listOfUnchecked = [];
$('.selectable-checkbox:unchecked').each(function () {
    listOfUnchecked.push($(this).attr('name'));
});
Antonio Correia
fonte
0

Passe a classe para a tag de entrada e acesse o valor do nome usando a classe

<input class="test-class" name='xxxxx' value=1>

<script>
    $('.test-class').attr('name');
</script>

Ou você também pode acessar o valor usando o id.

<input id="test-id" name='xxxxx' value=1>

<script>
    $('#test-id').attr('name');
</script>
Sheetal Mehra
fonte
-2

Para a linha abaixo, inicialmente enfrentou um problema sem fornecer um código único que o valor 'currnetRowAppName' não esteja ocupando espaço com a string. Então, depois de dar código único '"+row.applicationName+"', também está ocupando espaço.

Exemplo:

<button class='btn btn-primary btn-xs appDelete' type='button' currnetRowAppName='"+row.applicationName+"' id="+row.id+ >

var viewAppNAME = $(this).attr("currnetRowAppName");
alert(viewAppNAME)

Isso está funcionando bem.

Senthil Kumar SK
fonte