Ir para conteúdo

Arquivado

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

VCastilho

Capturar ação de um botão

Recommended Posts

Bom Dia


Desenvolvi um filtro HTML e estou com dificuldades em criar o JavaScript para o funcionamento do mesmo, poderiam em ajudar a criar esse JS?
Segue o código:
 

<div id = "filtro">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <style disabled>
    

    #filtro {
    border-style:double;
}

#button1 {
    width: 120px;
    position: inherit;
    right: 10px;
    background-color: #e00505;
    font-size: 12px;
    FLOAT: right
}

h4 {
    font-size: 18px;
    border-style: inset;
}

select {
    border: 1px solid #000;
    box-sizing: border-box;
    width: 124px;
    border-radius: 5px;
    height: 25px;
    padding: 3px;
}

section label {
    width: calc(100% / 4);
    color: red;
    text-align: center;
}

section {
    display: flex;
    flex-wrap: wrap;
}
h4/ {
    border-style:double;
}


@media screen and (max-width:768px) {
    section label {
        margin-bottom: 20px;
        width: 100%;
    }
}
</style>
<h4 style="text-align: center;">Personalize o seu Kit de Segurança</h4><br><br>

<form action="#" id="form">

    <section>
        <label>
            <b> Tipo do seu Kit </b><br>
            <select name="speed" id="speed" style=" ">
                <option desable>Selecione</option>
                <option>Residencial</option>
                <option>Comercial</option>
            </select>
        </label>
        <label>
            <b>Qualidade de Seu Kit</b><br>
            <select name="files" id="files" style=" ">
                <option desable> Selecione </option>
                <option value="HD">HD</option>
                <option value="Full HD">Full HD</option>
                <option value="Analógica">Analógica</option>

            </select>
        </label>
        <label>
            <b> Quantidade de Câmeras </b><br>
            <select name="number" id="number" style=" ">
                <option desable> Selecione </option>
                <option>1 Câmera</option>
                <option>2 Câmeras</option>
                <option>3 Câmeras</option>
                <option>4 Câmeras</option>
                <option>5 Câmeras</option>
                <option>6 Câmeras</option>
                <option>7 Câmeras</option>
                <option>8 Câmeras</option>
                <option>9 Câmeras</option>
                <option>10 Câmeras</option>
                <option>11 Câmeras</option>
                <option>12 Câmeras</option>
                <option>13 Câmeras</option>
                <option>14 Câmeras</option>
                <option>15 Câmeras</option>
                <option>16 Câmeras</option>
            </select>
        </label>
        <label>
            <b> Selecione a Marca </b><br>
            <select name="salutation" id="salutation">
                <option desable selected>Selecione</option>
                <option>Intelbras</option>
                <option>Hikvision</option>
                <option>Outras</option>
            </select>
        </label>
    </section>
  
<BR>
    <BR>
   
 
</form>
 
</div>
<br>
<br>
 <button class="kd-filter-button" id="button1">Ver resultados</button>

Seria bom, se possível o botão funcionar fora da tag "form" pois para personalizar fica melhor

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por juniormatrix
      Olá
       
      Achei esse script aqui no fórum mesmo:
       
      $.validator.addMethod( "customEmail", function (value, element) { return this.optional(element) || /^[\w-\.]+@fulano\.com\.br$/i.test(value); }, "Por favor, insira um e-mail válido com o domínio @fulano.com.br" ); $("#formulario").validate({ ignore: ".ignore", rules: { empresa: { required: true }, nome: { required: true }, contato: { required: true }, celular: { required: true }, email: { required: true, email: true, customEmail: true }, }, }); Testei e funcionou perfeitamente, mas gostaria que liberasse mais e-mails válidos, ao invés de apenas um.

      Tem como fazer? 
       
      Se alguém puder ajudar, fico muito grato.
    • Por Alessandro Bodão
      Salve galerinha, passando pra mostrar pra vocês o novo projeto de marca que a Jatobá Estúdio desenvolveu, espero que gostem.   https://www.behance.net/gallery/166555627/Fernanda-Pinheiro-Nutricionista-Esportiva
    • Por rogerblower
      Boas pessoal, estou precisando de um calendário para agenda com crud para agendamento, mas teria que ser free.
      Obrogado.
    • Por Sapinn
      Fala galera! Tenho um site que possui alguns icones que são puxados da biblioteca flaticon , o problema é que de uma hora pra outra esses icones pararam de aparecer. No meu ambiente local funciona, mas no ambiente de produção eles não aparecem e eu recebo o seguinte erro no console: Failed to load resource: the server responded with a status of 404 () 
       
      Alguém saberia como resolver isso?
    • Por mateus.andriollo
      Carrego um conteudo Ajax e junto com ele vem HTML e JS, existe um marcador que está relacionado a um elemento HTML, quando eu clico e este elemento tem um atributo exemplo data-onload="funcaoOla()" esta função tbm carregada pelo ajax deve ser executada.
       
      Dúvida como eu faço uma chama de função desta forma, seria como exec("funcaoOla")
       
×

Informação importante

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