用JS控制form表单action去向大全

最新推荐文章于 2021-06-28 04:09:52 发布

stevenbill

最新推荐文章于 2021-06-28 04:09:52 发布

阅读量284

点赞数

CC 4.0 BY-SA版权

分类专栏： JAVA 文章标签： PHP

本文链接：https://blog.youkuaiyun.com/stevenbill/article/details/83835064

JAVA 专栏收录该内容

332 篇文章

订阅专栏

本文介绍如何使用JavaScript根据用户选择动态更改表单提交的目标页面。包括通过不同按钮提交至不同地址的方法，以及根据下拉菜单选项提交至特定页面的技术。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

不知道大家遇没遇到这种情况，当我们提交一个表单的时候，可能因为相关的参数不同而需提交给不同的action地址。这时我们就可以用JS来实现这种功能。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
把相同的内容提交到不同的页面
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
一，使用多个submit提交、一个表单，多个submit
<script>
function fun_1(){
document.getElementById("my_form").action="a.php";
document.getElementById("my_form").submit();
}
function fun_2(){
document.getElementById("my_form").action="b.php";
document.getElementById("my_form").submit();
}
......................................
<form action="" method="post" name="my_form" id="my_form">
<input name="mytext" type="text" id="mytext" />
<input name="sub1" type="button" id="sub1" value="提交到a.php" onclick="fun_1()" />
<input name="sub2" type="button" id="sub2" value="提交到b.php" onclick="fun_2()" />
</form>
===============================
还有一种情况，在一个表单里，跟据select、input、radio选择的不同提交到不同的页面。
实例：
将图片传入不同的相册。我用select的值选择。

<form method="post" enctype="multipart/form-data" name="album_upload" id="album_upload" action="knuthan" >
<p>选择相册：
<select name="album_select" id="album_select">
<option value="111">aaa</option>
<option value="222">bbb</option>
<option value="333">ccc</option>
<{section name=row loop=$album_list}> <{/section}>
</select>
</p>
<p>文件：
<input name="photo_upload" type="file" id="photo_upload" size="40" />
</p>
<p>
<input type="submit" name="upload" id="upload" value="上传" onclick="reurl();"/>
<br />
</p>
</form>

..........................................
<script language="javascript">

function reurl(){
var al_url = "index.php?do=upload&album=";
var al_url_obj = document.getElementById("album_select");
var al_url_index = al_url_obj.value;
document.album_upload.action=al_url+al_url_index;
}

</script>