4

Tenho um campo(input text), e gostaria de pegar o value, e passar como variavel.

Em outras palavras, passar o valor deste campo texto para dentro da:

var valor do campo aqui ;

Vide o exemplo que deixo:

<script language="javascript">
<!--
var nome
nome = window.prompt("Digite o nome para variável:");
document.write("var " +nome+ ";<br>");
//-->
</script>

Este exemplo dá uma idéia clara. A real intenção é que, o resultado seja incluso em tempo de execução, no código fonte, setado como variável dentro da function exemplo(){ var +nome+ = "valor"; }; e/ou function exemplo(){ var valor = "+nome+" };. Seria algo como um id(identificador) que receberia qualquer valor.

Tenho elaborado este exemplo mais concreto da seguinte forma:

<script language="javascript">
 <!--
  var nome 
  nome = window.prompt("Digite o nome:");
  variavel = document.createElement('script');
  variavel.textContent = nome; 
  document.getElementById("id").appendChild(variavel);
 //-->
</script>

Mas, só consigo criar elementos HTML, nada funcional pro propósito, no qual preciso incorporar diretamente no código fonte da página aberta dentro do script.

Espero ter sido claro. Agradeço ajuda, desde ja.

4
  • Olá Diego. Está pouco clara a pergunta. Tens um <input type="text"> correto? e depois queres que o valor inserido aí vá para uma variável certo? podes explicar melhor o que acontece depois?
    – Sergio
    Commented 10/04/2016 às 20:31
  • Diego, dá um salto aqui: chat.stackexchange.com/rooms/25038/javascript
    – Sergio
    Commented 10/04/2016 às 21:07
  • Juntei resposta em baixo, a ver se ajuda. Se tens problemas a aceder ao chat por causa do navegador faz download do Chrome ou Firefox e testa de novo.
    – Sergio
    Commented 10/04/2016 às 21:56
  • Tem certeza que você precisa criar variáveis com o nome dinâmico assim e não bastaria usar campos de uma tabela global, como var minhatabela = {}; minhatabela[nomedocampo] = valordocaompo? Se você sair sobrescrevendo variáveis globais tem sempre a chance de estragar o valor de alguma variável existente.
    – hugomg
    Commented 13/04/2016 às 4:18

3 Respostas 3

4

O método eval(); é uma opção. Talvez a única resposta aqui que irá trabalhar para as variáveis ​​não-globais. Embora eval(); não deve ser utilizado neste caso como existem métodos melhores.

Falando em métodos melhores você pode usar o objeto window tem uma referência para todas as variáveis ​​globais e funções globais que você está usando.

Mas, se você não quiser usar um método eval(); ou objeto window. você pode tentar algo como isto:

<script language="javascript">
 <!--
 var obj = {}; 
 obj['teste'] = 'Não há mais necessidade de armazenar em um objeto global.\nO segredo fica por conta do acesso a propriedades via string.'; 
 alert(obj['teste']); 
 //-->
</script>

Em JavaScript esses dois são equivalentes: obj.teste = 'valorString' obj['teste'] = 'valorString'

Para ilustrar um pouco melhor o funcionamento de algum destes métodos/objetos, criei exemplos que utiliza uns exemplos para demonstrar o uso das variáveis dinâmicas

Exemplo 1

<script language="javascript">
 <!--
 var nome;
 nome = window.prompt("Digite o nome:");
 var x = nome;
 var valor = 'x';
 // resultado
 alert(eval(valor)); 
 //-->
</script>

Exemplo 2

<script language="javascript">
 <!--
 var nome;
 nome = window.prompt("Digite o nome");
 var x = 'valor';
 str = x+' = '+'nome';
 eval(str);
 // resultado
 alert(valor);
 //-->
</script>

Se você precisa criar variáveis dinâmica em Javascript, e não sabe de quantas variáveis vai precisar. Use a sintaxe for, faça um loop com o método eval();. O método eval(); recebe como parâmetro uma String que será executada como se fosse um comando. Veja:

Exemplo 1

<script language="javascript">
 <!--
 var nome;
 nome = window.prompt("Digite o nome:");
 for(var i = 1; i <= 3; i++)
 { 
 window['v' +i] = "var " + i; 
 } 
 // recuperando as variaveis 
 alert(v1); // variavel 1 
 alert(v2); // variavel 2 
 alert(v3); // variavel 3 
 //-->
</script>

Exemplo 2

<script language="javascript">
 <!--
 //criando variável dinâmica
 var valor;
 valorTeste = window.prompt("Digite o nome:");
 for(var i = 0; i < 3; i++) {
 eval("nome" +i+ " = '"+valor+"';");

 //recuperando os valores dessas variáveis
 alert(window["nome" +i]);
 }
 //-->
</script>

Exemplo 3

Agora, vamos criar variáveis dinâmicas usando o objeto window do javascript:

<script language="javascript">
 <!--
 //criando algumas variáveis dinamicamente
 for (var i = 0; i < 5; i++)
 {
 window["nome" + i] = i + 10;
 }

 //recuperando os valores dessas variáveis
 for (var i = 0; i < 5; i++)
 {
 alert(window["nome" + i]);
 }
</script>

Exemplo 4

<script language="javascript">
 <!--
 //criando variável dinâmica
 var nome;
 nome = window.prompt("Digite o nome:");
 for(var i = 0; i < 3; i++) {
 alert(eval+"(var "+nome+i+" = '"+i+"';)");
 }
 //-->
</script>

Estes exemplos são muito simples, embora pouco práticos.

1

Se percebi bem a tua pergunta queres criar um script, e pelo menos uma variável cujo nome é defenido por um <input> no HTML. Depois queres inserir esse script na página de modo a que dê para ver com as ferramentas do browser.

Acho que é isto que procuras:

function addScript(varname) {
    var script = document.createElement('script');
    script.innerText = 'var ' + varname + ' = 10; alert(' + varname + ');';
    document.body.appendChild(script);
}

var input = document.querySelector('input');
var button = document.querySelector('button');
button.addEventListener('click', function(){
	var name = input.value;
	addScript(name);
});
<input type="text">
<button>testar</button>

jsFiddle: https://jsfiddle.net/g4vfdsj1/

O que esse script faz é esperar que o button seja clicado, depois vai buscar o valor do input, depois chama uma função a quem passa esse valor do input, depois cria um elemento script e insere-lhe o valor do input e por fim insere-o no DOM.

0

No Html faça o seguinte:

<input type="text" id="seuInput"  onkeyup="keyupFunction()">

No javascript:

function keyupFunction() {
   var valor_do_campo_aqui = document.getElementById("seuinput").value;
}
2
  • O autor da pergunta quer criar uma "variavel dinâmica". Acho que quer algo do tipo window[input.value] = 'foo';... convidei-o para o chat. Vamos ver se a pergunta fica mais clara.
    – Sergio
    Commented 10/04/2016 às 21:17
  • 1
    @Sergio Valeu pela dica, não vi que você tinha postado um link eu ainda estava escrevendo. Commented 10/04/2016 às 21:19

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 .