Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Gabriel Catelli Goulart

JavaScript, identificar número no getElementById();

Recommended Posts

Olá, eu estou com um código em java que ele busca o id através do getElementById(); em um textarea, mas a ide dele é formada da seguinte forma,

 

puxo do banco de dados com o PHP o id da linha de uma tal informação que está na tabela, e coloco na identificação/ id da TextArea assim:

 <textarea id="auto<?= $iddalinhadatabela ?>"></textarea>

cuja resultado seria:

<textarea id="auto32"></textarea>

ou seja, elá é uma div praticamente aleatória, mas até ai tudo bem, a minha dúvida é que no meu getElementById(); sou pego o id sem o número, estando assim:

 getElementById("IDDATEXTAREA");

ta mas como eu posso identificar esse número através do getElementById(); ?

eu já pensei em várias formar como exemplo:

 getElementById("IDDATEXTAREA" + IsNumeric );

Mas nada da certo... o que eu faço? ME AJUDEM! :P kk

Compartilhar este post


Link para o post
Compartilhar em outros sites

Use o querySelector no lugar do getElementById, ai você vai ser capaz de fazer:

 

document.querySelector('textarea[id*="auto"]');

Compartilhar este post


Link para o post
Compartilhar em outros sites

William, nada :( tentei mas não consegue identificar o textarea.

 

Segue o html:

<textarea rows="1" name="autoestica" class="autoestica" id="auto<?= $id_pergunta ?>" style="width:238px; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; resize:none; outline:none; font-family:Tahoma, Geneva, sans-serif; color:#000; font-size:12px; margin-top:5px; min-height:20px; border:none; border-left:1px solid <?php echo $_SESSION['coruser'] ?>;" placeholder="Resposta:"></textarea>

 

Segue o java:

<script type="text/javascript">
var observe;
if (window.attachEvent) {
    observe = function (element, event, handler) {
        element.attachEvent('on'+event, handler);
    };
}
else {
    observe = function (element, event, handler) {
        element.addEventListener(event, handler, false);
    };
}
function init () {
var numeros;
    var text = document.querySelector(textarea[id="auto"]);
    function resize () {
        text.style.height = 'auto';
        text.style.height = text.scrollHeight+'px';
    }
    /* 0-timeout to get the already changed text */
    function delayedResize () {
        window.setTimeout(resize, 0);
    }
    observe(text, 'change',  resize);
    observe(text, 'cut',     delayedResize);
    observe(text, 'paste',   delayedResize);
    observe(text, 'drop',    delayedResize);
    observe(text, 'keydown', delayedResize);


    text.focus();
    text.select();
    resize();
}
</script>

Uma outra dúvida é seu eu conseguiria puxar pelo name ou talvez pela class, isso é um script para deixar o textarea elástico.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Note o simbolo * no meu seletor:

 

document.querySelector('textarea[id*="auto"]');

Compartilhar este post


Link para o post
Compartilhar em outros sites

Só lembrando que .querySelector requer IE8+. Se ainda precisares dar suporte a IE7 (triste...), vais precisar utilizar o .getElementsByTagName e fazer uma varredura manual em cada elemento e checar os valores das IDs.

Fiz um JSFiddle com uma implementação básica de como fazer isso, apenas pra referência.


Existe mais de um elemento que tenha o nome parecido? Pois o .querySelector() retorna a primeira ocorrencia. Pra retornar todas, precisas utilizar o .querySelectorAll().

Esclarecendo algumas coisas:

O filtro textarea[id*=auto] encontrará id="33auto", id="auto33" e id="33auto33"

O filtro textarea[id^=auto] encontrará apenas id="auto33", mas não id="33auto" e id="33auto33"

O filtro textarea[id$=auto] encontrará apenas id="33auto", mas não id="auto33" e id="33auto33"

Compartilhar este post


Link para o post
Compartilhar em outros sites

Muito bom @Rafael Sirotheau, ótima explicação e contexto.

 

Ainda outra alternativa, é usar um polyfill, então poder usufruir da nova api, "sem se preocupar"

https://github.com/jonathantneal/polyfill

Compartilhar este post


Link para o post
Compartilhar em outros sites

querySelectorAll() vai te devolver um array com vários.

 

Ai vc vai ter q fazer um loop pelos elementos retornados.

Compartilhar este post


Link para o post
Compartilhar em outros sites

var $texts = document.querySelector('textarea[id*="auto"]'),

i = $texts.length;

 

while (i--) {

//do something with $texts;

}

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.