窗体动作 - 用jQuery改变

<form name="selEstadoRepresentante" id="form" method="post" action="/representantes/?uf="> 
 
    <select class="selectpicker" name="state" id="state"> 
 
    <option value="">Selecione</option> 
 
    <option value="AC">Acre</option> 
 
    <option value="AL">Alagoas</option> 
 
    <option value="AP">Amapá</option> 
 
    <option value="AM">Amazonas</option> 
 
    <option value="BA">Bahia</option> 
 
    <option value="CE">Ceará</option> 
 
    <option value="DF">Distrito Federal</option> 
 
    <option value="ES">Espírito Santo</option> 
 
    <option value="GO">Goiás</option> 
 
    <option value="MA">Maranhão</option> 
 
    <option value="MT">Mato Grosso</option> 
 
    <option value="MS">Mato Grosso do Sul</option> 
 
    <option value="MG">Minas Gerais</option> 
 
    <option value="PA">Pará</option> 
 
    <option value="PB">Paraíba</option> 
 
    <option value="PR">Paraná</option> 
 
    <option value="PE">Pernambuco</option> 
 
    <option value="PI">Piauí</option> 
 
    <option value="RJ">Rio de Janeiro</option> 
 
    <option value="RN">Rio Grande do Norte</option> 
 
    <option value="RS">Rio Grande do Sul</option> 
 
    <option value="RO">Rondônia</option> 
 
    <option value="RR">Roraima</option> 
 
    <option value="SC">Santa Catarina</option> 
 
    <option value="SP">São Paulo</option> 
 
    <option value="SE">Sergipe</option> 
 
    <option value="TO">Tocantins</option> 
 
    </select> 
 
    <input class="btBuscar" name="btBuscar" value="BUSCAR" type="submit" title="Buscar"> 
 
</form>

步骤：

选择：其中一个选项
选项值：例如：AM
提交
<form name="selEstadoRepresentante" id="form" method="post" action="/representantes/?uf=AM">

我该怎么做？

我认为jQuery解决了这个问题但我不知道该怎么做。

来源

2017-09-15 Kleyton Renato

的可能的复制[jQuery的获取所选选项从下拉菜单（https://stackoverflow.com/questions/ 10659097/jquery-get-selected-option-from-dropdown） – Deja

$('#state').change(function() { 
 
    var action = '/representantes/?uf=' + $(this).find(":selected").val(); 
 
    $('#form').attr('action', action); 
 
    alert($('#form').attr('action')); 
 
});

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g=" crossorigin="anonymous"></script> 
 
<form name="selEstadoRepresentante" id="form" method="post" action="/representantes/?uf="> 
 
    <select class="selectpicker" name="state" id="state"> 
 
    <option value="">Selecione</option> 
 
    <option value="AC">Acre</option> 
 
    <option value="AL">Alagoas</option> 
 
    <option value="AP">Amapá</option> 
 
    <option value="AM">Amazonas</option> 
 
    <option value="BA">Bahia</option> 
 
    <option value="CE">Ceará</option> 
 
    <option value="DF">Distrito Federal</option> 
 
    <option value="ES">Espírito Santo</option> 
 
    <option value="GO">Goiás</option> 
 
    <option value="MA">Maranhão</option> 
 
    <option value="MT">Mato Grosso</option> 
 
    <option value="MS">Mato Grosso do Sul</option> 
 
    <option value="MG">Minas Gerais</option> 
 
    <option value="PA">Pará</option> 
 
    <option value="PB">Paraíba</option> 
 
    <option value="PR">Paraná</option> 
 
    <option value="PE">Pernambuco</option> 
 
    <option value="PI">Piauí</option> 
 
    <option value="RJ">Rio de Janeiro</option> 
 
    <option value="RN">Rio Grande do Norte</option> 
 
    <option value="RS">Rio Grande do Sul</option> 
 
    <option value="RO">Rondônia</option> 
 
    <option value="RR">Roraima</option> 
 
    <option value="SC">Santa Catarina</option> 
 
    <option value="SP">São Paulo</option> 
 
    <option value="SE">Sergipe</option> 
 
    <option value="TO">Tocantins</option> 
 
    </select> 
 
    <input class="btBuscar" name="btBuscar" value="BUSCAR" type="submit" title="Buscar"> 
 
</form>

来源

2017-09-15 21:56:59 Abe

谢谢！但它没有在这里工作... –

@KleytonRenato我已编辑帖子向你展示。 – Abe

是的！它在这里运行Stackflow ...它可能会在我的页面中发生冲突。 –

的jsfiddle：https://jsfiddle.net/fkpnvecq/1/

jQuery代码

$(function() 
{ 
    $('.selectpicker').on('change', function() 
    { 
    if($(this).val()) 
    { 
     $('#form').submit(); 
    } 
    }); 
});

在变化的下拉selectpicker，检查，看它是否有一个值$(this).val()，如果它确实有然后选择一个值，其ID为#form，然后运行submit方法。

如果你只希望它为特定值工作，你可以只使用状态，如果像这样if($(this).val() && $(this).val() == 'AM')

来源

2017-09-15 22:04:05 Canvas

如果你想实现与PHP一样，你为什么不使用方法GET和变化uf的字段名称，像这样？

<form name="selEstadoRepresentante" id="form" method="get" action="/representantes"> 
     <select class="selectpicker" name="uf" id="state"> 
     <option value="">Selecione</option> 
     <option value="AC">Acre</option> 
     <option value="AL">Alagoas</option> 
     <option value="AP">Amapá</option> 
     <option value="AM">Amazonas</option> 
     <option value="BA">Bahia</option> 
     <option value="CE">Ceará</option> 
     <option value="DF">Distrito Federal</option> 
     <option value="ES">Espírito Santo</option> 
     <option value="GO">Goiás</option> 
     <option value="MA">Maranhão</option> 
     <option value="MT">Mato Grosso</option> 
     <option value="MS">Mato Grosso do Sul</option> 
     <option value="MG">Minas Gerais</option> 
     <option value="PA">Pará</option> 
     <option value="PB">Paraíba</option> 
     <option value="PR">Paraná</option> 
     <option value="PE">Pernambuco</option> 
     <option value="PI">Piauí</option> 
     <option value="RJ">Rio de Janeiro</option> 
     <option value="RN">Rio Grande do Norte</option> 
     <option value="RS">Rio Grande do Sul</option> 
     <option value="RO">Rondônia</option> 
     <option value="RR">Roraima</option> 
     <option value="SC">Santa Catarina</option> 
     <option value="SP">São Paulo</option> 
     <option value="SE">Sergipe</option> 
     <option value="TO">Tocantins</option> 
     </select> 
     <input class="btBuscar" name="btBuscar" value="BUSCAR" type="submit" title="Buscar"> 
    </form>

如果你必须这样做，特别是与jQuery比你可以这样做：

$('#state').change(function() { 
     var formaction = '/representantes/?uf=' + 
$(this).find(":selected").val(); 
     $('#form').attr('action', formaction); 
     $('#form').submit(); 
    });

来源

2017-09-15 22:21:25

窗体动作 - 用jQuery改变

回答

相关问题