javascript change - Como faço para selecionar um elemento com seu atributo name em jQuery?




title tag (5)

jQuery("[name='test']") 

Embora você deva evitá-lo e, se possível, selecione por ID (por exemplo, #myId ), pois isso tem melhor desempenho, pois invoca o getElementById nativo.

Esta questão já tem uma resposta aqui:

Como obter um elemento com seu atributo name com jQuery?

Existe alguma coisa (como # para id e . Para a classe) para o nome em jQuery?


Você sempre pode fazer $('input[name="somename"]')



Você pode usar:

jQuery('[name="' + nameAttributeValue + '"]');

essa será uma maneira ineficiente de selecionar elementos, portanto, seria melhor usar também o nome da tag ou restringir a pesquisa a um elemento específico:

jQuery('div[name="' + nameAttributeValue + '"]'); // with tag name
jQuery('div[name="' + nameAttributeValue + '"]',
     document.getElementById('searcharea'));      // with a search base

O homem de palha

Eu preciso saber quantas vezes um botão foi clicado e fazer algo a cada terceiro clique ...

Solução razoavelmente óbvia

// Declare counter outside event handler's scope
var counter = 0;
var element = document.getElementById('button');

element.addEventListener("click", function() {
  // Increment outside counter
  counter++;

  if (counter === 3) {
    // Do something every third time
    console.log("Third time's the charm!");

    // Reset counter
    counter = 0;
  }
});
<button id="button">Click Me!</button>

Agora isso funcionará, mas ele invade o escopo externo adicionando uma variável cujo único propósito é manter o controle da contagem. Em algumas situações, isso seria preferível, pois seu aplicativo externo pode precisar acessar essas informações. Mas, neste caso, estamos apenas alterando o comportamento de cada terceiro clique, portanto, é preferível incluir essa funcionalidade no manipulador de eventos .

Considere esta opção

var element = document.getElementById('button');

element.addEventListener("click", (function() {
  // init the count to 0
  var count = 0;

  return function(e) { // <- This function becomes the click handler
    count++; //    and will retain access to the above `count`

    if (count === 3) {
      // Do something every third time
      console.log("Third time's the charm!");

      //Reset counter
      count = 0;
    }
  };
})());
<button id="button">Click Me!</button>

Observe algumas coisas aqui.

No exemplo acima, estou usando o comportamento de fechamento do JavaScript. Esse comportamento permite que qualquer função tenha acesso ao escopo no qual ela foi criada, indefinidamente. Para praticamente aplicar isso, invoco imediatamente uma função que retorna outra função, e como a função que estou retornando tem acesso à variável de contagem interna (devido ao comportamento de fechamento explicado acima), isso resulta em um escopo privado para uso pelo resultado resultante. função ... não tão simples? Vamos diluir isso ...

Um fechamento simples de uma linha

//          _______________________Immediately invoked______________________
//         |                                                                |
//         |        Scope retained for use      ___Returned as the____      |
//         |       only by returned function   |    value of func     |     |
//         |             |            |        |                      |     |
//         v             v            v        v                      v     v
var func = (function() { var a = 'val'; return function() { alert(a); }; })();

Todas as variáveis ​​fora da função retornada estão disponíveis para a função retornada, mas não estão diretamente disponíveis para o objeto de função retornado ...

func();  // Alerts "val"
func.a;  // Undefined

Pegue? Portanto, no nosso exemplo primário, a variável count está contida no fechamento e sempre disponível para o manipulador de eventos, portanto, mantém seu estado de clique para clique.

Além disso, esse estado de variável privada é totalmente acessível, tanto para leituras quanto para designar variáveis ​​privadas no escopo.

Ai está; Agora você está totalmente encapsulando esse comportamento.

Postagem completa do blog (incluindo considerações sobre jQuery)







javascript jquery