Question

我的表格如下所示：

<div>
<form id="speed_form" action="/dashboard/speed" method="get">
<select name="speed">
  <option value="1">1 Rate</option>
  <option value="2">2 Rate</option>
  <option value="3">3 Rate</option>
  <option value="4">4 Rate</option>
  <option value="5">5 Rate</option>
</select>
<input type="hidden" name="123456" />
</form>
</div>

我使用此js代码提交上述表单：

<script type="text/javascript">
$("select[name=speed]").change(function(){
        $("#speed_form").submit();       
});
</script>

我想向页面GET发送/dashboard/speed?speed=name&id=value个请求。名称被input标记隐藏。我应该option value进入GET方法!!!

你可以帮我实现吗？非常感谢！

Answer 1

尝试更换：

<input type="hidden" name="123456" value=4 />

由：

<input type="hidden" name="id" value="4" />
<input type="hidden" name="name" value="123456"/>

Answer 2

您可以使用$.ajax并自行创建网址和数据：

$(function()
{
    $('form').on('submit', function(event)
    {
        var elem = $('input[type="hidden"]');

        var data = 'speed=' + $(elem).attr('name') + '&id=' + $(elem).val();

        $.ajax(
        {
            url: "/dashboard/speed",
            data = data
        });

        event.preventDefault();
    });
});

Answer 3

替换你这样的代码

<div>
<form id="speed_form" action="/dashboard/speed" method="get">
<select name="speed">
  <option value="1">1 Rate</option>
  <option value="2">2 Rate</option>
  <option value="3">3 Rate</option>
  <option value="4">4 Rate</option>
  <option value="5">5 Rate</option>
</select>
<input type="hidden" name="name" value=123456/>
<input type="hidden" name="id" value=4 />
</form>
</div>

并像这样更改你的java脚本

<script type="text/javascript">
$("select[name=speed]").change(function(){
        $("input name:id").val($("select[name=speed]").val());  
        $("#speed_form").submit(); 


});
</script>

请查看以下链接val() change()。使用class或id属性选择dom。请记住，您可以在这种情况下使用AJAX。

Answer 4

只有功能绑定问题你需要在$（function（）

中编写你的Jquery代码

<script type="text/javascript">
$(function()
{
   $("select[name=speed]").change(function(){
    $("#speed_form").submit();       
   });

}
</script>

如果您有任何错误回复，请在浏览器中安装web devloper工具以查看错误

Answer 5

使用此代码替换脚本部分。它可能对你有所帮助

<script type="text/javascript">
$("select[name=speed]").change(function(){
    this.form.submit();      
});
</script>

Answer 6

<div>
<form id="speed_form" action="/dashboard/speed" method="get">
<select name="speed" id="speed">
  <option value="1">1 Rate</option>
  <option value="2">2 Rate</option>
  <option value="3">3 Rate</option>
  <option value="4">4 Rate</option>
  <option value="5">5 Rate</option>
</select>
<input type="hidden" name="123456" id="hidden"/>
</form>
</div>

//Most simple
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$("#speed").change(function(){
        var value = $(this).val();
        $('#hidden').val(value);
        $("#speed_form").submit();
});
</script>

我建议始终指定ID

Javascript根据输入标签提交表单

6 个答案: