1

function teste(valor)
{
    if( valor=="novo" )
    {
        document.getElementById('quantdependente').style.display = 'block';
    }
    else
    {
        document.getElementById('quantdependente').style.display = 'none';
    }
}
#quantdependente {
    display: none;
}
<html>

<body>
  <form id="formulario" name="formulario" action="montadependente.php" method="post">
    <select name="teste" id="teste" onchange="teste( this.value );">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="novo">novo</option>
    </select>
    <div id="quantdependente" name="quantdependente">
      <input type="number" value="" step="1">
    </div>
    <input type="submit" name="btenviar" value="enviar">
  </form>
</body>

</html>

2
  • Não entendi a pergunta? O código aparentemente funciona. Pode acrescentar uma descrição detalhista do seu problema? Commented 2/11/2019 às 15:57
  • 1
    @AugustoVasques ao testar o código no Chrome ocorre o erro Uncaught TypeError: teste is not a function, isto porque ele criou um elemento com o id="teste", o que conflita com a função chamada function teste(valor), pois é algo comum em navegador usarem IDs do DOM como variaveis globais do objeto window., como foi explicado em pt.stackoverflow.com/q/123098/3635
    – Syzoth
    Commented 2/11/2019 às 18:13

2 Respostas 2

2

Tente adicionar um evento ao elemento, acredito que seja a melhor opção

function teste() {
	valor = this.value;

	console.log( 'mudou para: '+ valor )

  if( valor == 'novo' ) {
		document.getElementById('quantdependente').style.display = 'block';
	} else {
		document.getElementById('quantdependente').style.display = 'none';
	}
}
document.getElementById('teste').addEventListener('change', teste);
#quantdependente {
    display: none;
}
<html>

<body>
  <form id="formulario" name="formulario" action="montadependente.php" method="post">
    <select name="teste" id="teste" >
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="novo">novo</option>
    </select>
    <div id="quantdependente" name="quantdependente">
      <input type="number" value="" step="1">
    </div>
    <input type="submit" name="btenviar" value="enviar">
  </form>
</body>

</html>

2

Esse é um comportamento peculiar do navegador. Dentro dos eventos de cada elemento como onclick e onchange, algumas variáveis são inicializadas implicitamente pelo navegador, como as variáveis event, arguments, e uma outra variável como o mesmo id do elemento, no seu caso, teste.

Você tem um elemento e uma função com o nome teste, e dentro do onchange daquele elemento, teste se refere ao elemento, não a função, por isso invocar teste( this.value ) resulta num erro, pois teste não é uma função. Repare que o código funciona se a função tiver outro nome:

function testeFunc(valor) {
    console.log('Função foi invocada recebendo o valor', valor)
}
#quantdependente {
    display: none;
}
<html>

<body>
  <form id="formulario" name="formulario" action="montadependente.php" method="post">
    <select name="teste" id="teste" onchange="testeFunc( this.value );">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="novo">novo</option>
    </select>
    <div id="quantdependente" name="quantdependente">
      <input type="number" value="" step="1">
    </div>
    <input type="submit" name="btenviar" value="enviar">
  </form>
</body>

</html>

2
  • Sua explicação é muito coerente. Sabes dizer se há/existe documentação a respeito ... fiquei curioso? Commented 2/11/2019 às 16:12
  • 1
    Desculpe Lauro, não conheço documentação sobre isso. Aprendi sobre essas variáveis no SO americano.
    – Andre
    Commented 2/11/2019 às 16:18

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