Jump to content
vinitf

Lista de com número de elementos pela escolha do usuário

Recommended Posts

Bom dia, quero gerar através de um input uma forma de que o usuário possa escolher a quantidade de elementos que ele quer na lista (de 0 a 1000 elementos), e ao clicar no botão "gerar", a lista apareça com números aleatórios, mas com a quantidade de números de acordo com a escolha dele. 

<html>
<input id="quantidadeElementos" />
<button onclick="myFunction()">Gerar</button>
<p id="gerar"></p>
</html>
<script>
var lista = [];
for (var i = 0, max =1000; i < max; i++) {
  lista.push(parseInt(Math.random() * 100));
}
function myFunction() {
    document.getElementById("gerar").innerHTML = lista;
}
document.getElementById("botão").addEventListener("click", myFunction);
</script>

 

Share this post


Link to post
Share on other sites
<html>
<head>

</head>
<body>

  <input id="quantidadeElementos" />
  <button id="botao">Gerar</button>
  <p id="gerar"></p>

  <script>
  document.getElementById("botao").addEventListener("click", function() {
    var lista = [];
    var max = document.getElementById("quantidadeElementos").value || 10;
    for (var i = 0; i < max; i++) {
      lista.push(parseInt(Math.random() * 100));
    }
    document.getElementById("gerar").innerHTML = lista;
  });
  </script>

</body>
</html>

 

Edited by William Bruno
Corrigir código

Share this post


Link to post
Share on other sites

Ainda não funcionou, o que pode ser?

 

O que eu quero é que o usuário possa escolher quantos elementos vão estar na lista, o que você colocou gera uma lista de 10 elementos. 

Share this post


Link to post
Share on other sites

Tinha alguns erros que eu não havia notado antes.

Use assim:

<html>
<head>
</head>
<body>
  <input id="quantidadeElementos" />
  <button id="botao">Gerar</button>
  <p id="gerar"></p>
  <script>
  document.getElementById("botao").addEventListener("click", function() {
    var lista = [];
    var max = document.getElementById("quantidadeElementos").value || 10;
    for (var i = 0; i < max; i++) {
      lista.push(parseInt(Math.random() * 100));
    }
    document.getElementById("gerar").innerHTML = lista;
  });
  </script>
</body>
</html>

 

  • +1 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By VCastilho
      Boa Tarde
      Estou tentando desenvolver um Filtro Inteligente, no qual funcionaria da seguinte forma:

      Filtro 1         Filtro 2          Filtro 3          Filtro 4 
      Opção 1
      Opção 2
      Opção 3


      Ao selecionar a Opção 1 do Filtro 1 liberaria as opções do filtro 2

      Filtro 1         Filtro 2              Filtro 3          Filtro 4 
      Opção 1      Opção 1 - a     
                           Opção 1 -b
                           Opção 1 -c

      Assim escolhendo a opção do filtro 2 liberaria as opções do Filtro 3 e assim por diante
      Ao escolher a Opção 2 do Filtro 1 liberaria outras opções

      No caso preciso aplicar na plataforma da Tray, que é o de menos porém não consigo chegar ao código certo
      Estou tentando utilizar o HTML e o JQuery em conjunto para isso, conseguem me ajudar? Realmente estou perdido na situação

      Atenciosamente Vinicius Castilho
    • By cauai
      Olá,
      Eu estou tentando criar uma lista de vendedores que irão receber o contato de clientes através do meu site. É uma plataforma wordpress, porém tenho completo acesso ao código php.
      Até agora, só achei maneiras de enviar para múltiplos e-mails, como cópia, ou separando por departamento à escolha do cliente, utilizando o Contact Form 7, o que não é meu desejo.
      Quero algo como isso:
       
      Não sei se o Contact Form 7 me permitiria algo desse tipo, ou se teria mesmo que fazer pelo php. Mas aceito ajuda para ambos os casos.
    • By Marcosvn
      Eu preciso criar uma funcao que pegue todas as tags <h2> dentro da sessao <article> 
       
      Basicamente oq eu quero fazer eh gerar um índice de links ancoras dinamicamente para deixar logo no inicio da pagina e, assim o usuario acessar diretamente o topico de interesse.
       
      Porem eu nao faço ideia por onde comecar essa função. Alguem pode me dar a direcao ??
       
      imagino que devo pegar cada tag H2 e armazenar numa variavel. Porem nao sei como faço isso
       
      Outro problema eh q vou precisar inserir a atributo id="#<h2>"  tbm dinamicamente
       
      nao sei se estou pensando certo ou se existe outras alternativas pra chegar nesse resultado. Mas qualquer esclarecimento ja ajuda
       
      vlw
    • By tiagozone
      Oi Gente Agradeço primeiramente, Acho que seja através do php, Gostaria de criar uma pagina  simples que pudesse ter a aréa do login e se você não fosse cadastrado se cadastrar. Porém nesse cadastro teria como se fosse um itoken uma senha normal letras e números, forçando só alguns a se cadastrar. Depois do cadastro, você logado teria acesso a uma pagina porém essa pagina teria tipo que bloquear o link de acesso. A pagina seria arquivos do google. Deu pra entender? Dá pra fazer isso ou é complicado ? Ou seja so entraria nesse link a pessoa logada etc... Sei que deve entrar banco de dados tbm.. É possivel ?
       
      Agradeço
    • By lerdofphp
      Pessoal, 
       
      Tenho uma pasta com arquivos de texto com datas e gostaria de criar uma lista automática com eles apenas usando HTML e JavaScript isso seria possível?
       
      A ideia é que o script realize a pesquise dos arquivos existente na pasta e cria-se o SELECT em HTML.
       
      Exemplo:
      Pasta: paginas
      Arquivos:
      - Arquivo-12-07.txt
      - Arquivo-13-07.txt
      - Arquivo-14-07.txt
       
      Resultado Esperado:
       
      <select>
        <option value="Arquivo-12-07.txt">Arquivo-12-07.txt</option>
        <option value="Arquivo-13-07.txt">Arquivo-13-07.txt</option>
        <option value="Arquivo-14-07.txt">Arquivo-14-07.txt</option>
      </select>
       
       
       
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.