JSFiddle - React, Tailwind, and code Playground

by Thiago Diniz

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<form id="form">    
    <select>
        <option value="" class="campo" disabled selected>Categoria</option>
        <option value="filtros" class="campo">Filtros</option>
        <option value="manoplas" class="campo">Manoplas</option>
        <option value="ponteiras" class="campo">Ponteiras</option>
        <option value="plasticos" class="campo">Pláticos</option>
        <option value="slider" class="campo">Slider</option>
        <option value="suporte-placa" class="campo">Suporte de placa</option>
        <option value="peso-de-guidao" class="campo">Peso de guidão</option>
        <option value="esticadores" class="campo">Esticadores</option>
        <option value="emendas" class="campo">Emendas</option>        
    </select>
   
    <select>
        <option value="" class="campo" disabled selected>Marca</option>
        <option value="fq=specificationFilter_192:Honda" class="campo">Honda</option>
        <option value="fq=specificationFilter_192:BMW" class="campo">BMW</option>
        <option value="fq=specificationFilter_192:Triumph" class="campo">Triumph</option>
    </select>
    
    <select>
        <option value="" disabled selected>Ano</option>
        <option value="fq=specificationFilter_193:Falcon" class="campo">Falcon</option>
    </select>    
</form>

<button type="button" id="send" class="btn">Buscar</button>

CSS

select{
    border:1px solid #f2f2f2;
    box-sizing:border-box;    
    width:30%;
    float:left;
}

option{
    padding:5px 10px;
    border-bottom:1px solid #f2f2f2;
}

JavaScript

var host = "http://www.rs1.com.br/";
$(document).ready(function(){$('#send').click(function(){
    var variables = '';
    // Percorre todos os campos campos dentro da tag select com a classe campo
    $('#form select').find('.campo').each(function(){
       variables += $(this).attr('value'); // Concatena o valor do option
    });
    var destination = host + variables;
    $('#link').html(destination)
    window.open(destination);
});

});

$(document).ready(function(){
    $('.divDoBotao').click(function(){
        $('.filtro').slideToggle('fast');
    });
});