如何使用 JavaScript 提交表单并重定向到 URL？答案

【问题标题】：How to submit form using JavaScript and redirect to a URL?如何使用 JavaScript 提交表单并重定向到 URL？
【发布时间】：2014-09-23 07:37:24
【问题描述】：

如何使用 JavaScript 提交表单并重定向到 URL ？

<form name="f1" method="get" action="aaa.php">
    name : <input type="text" name="value_1" value=""/><br>
    age: <input type="text" name="value_2" value=""/>
    <input type="submit" name="submit" value="send"/>
</form>

请查看此链接中的图片：

http://image.ohozaa.com/i/4d0/zCzQIH.jpg

按下提交按钮后，我想将页面重定向到www.example.com/aaa/robert/21

我该怎么做？

【问题讨论】：

您自己尝试过什么吗？也许用谷歌搜索了一些东西？我敢打赌，这个问题之前已经被问过很多次了。

标签： javascript php jquery forms

【解决方案1】：

用 html 代码试试这个

<form name="f1" method="get" action="aaa.php">
name : <input type="text" id="value_1" name="value_1" value=""/><br>
age: <input type="text" id="value_2" name="value_2" value=""/>
<input type="button" name="submit" onclick="checkredirect()" value="send"/>

还有 javascript

<script type="text/javascript">
function checkredirect(){
    var value_1 = $('#value_1').val();
    var value_2 =  $('#value_2').val();
    window.location = 'http://www.example.com/'+value_1+'/'+value_2;
    return false;
}
</script>

不要忘记添加 jQuery 库

【讨论】：

将此添加到上面的 javascrip 并更改按钮提交 -> type="button"
！不行，www.example.com/aaa.php?value_1=robert&value_2=21&submit=send
更改为
请不要在 HTML 中使用 onclick，这是邪恶的 ;-) 另外，如果提交是原生的，为什么要更改 window.location 呢？只需更改action 属性值就足够了。

【解决方案2】：

可能是这样的：

HTML：

<form id="f1" class="js-redirect" method="get" action="aaa.php">
    name : <input type="text" name="value_1" id="value_1" value=""/><br>
    age: <input type="text" name="value_2" id="value_2" value=""/>
    <input type="submit" name="submit" value="send"/>
</form>

注意：form 标签中的name 属性已弃用，请使用id 属性。 Input、select 和 textarea 标签也应该有 ids。

JS：

$('.js-redirect').on('submit', function() {
    var newUrl = this.action.replace('.php', '/' + $('#value_1').val() + '/' + $('#value_2').val());
    this.action = newUrl;
})

【讨论】：

【解决方案3】：

在php文件中设置标题

$dynamic = $_GET['value_1'];
$id =$_GET['value_2'];
header('location:www.example.com/aaa/'.$dynamic.'/'.$id);

【讨论】：

但是robet和21是动态数据。
设置变量而不是 robert 和 21，检查这个编辑
我的意思是 robert 和 21 来自表单输入。

【解决方案4】：

在点击按钮上试试这个功能

function myFunction() {
    document.getElementById("myForm").submit();
}

【讨论】：

这实际上什么也没做。
设置动作 action="www.example.com/aaa/robert/21" 这个