javascript 2x 提交按钮以操作不同的 URL
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7953301/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
2x submit buttons to action different URL
提问by user1019214
Need help with jquery to change my forms action depending on with SUBMIT Button press. I found some javascript code but its not working.
需要 jquery 的帮助来更改我的表单操作，具体取决于按下提交按钮。我找到了一些 javascript 代码，但它不起作用。
<form name="myform" onsubmit="return onsubmitform();">
Here is the function
这是函数
<script type="text/javascript">
function submitform()
{
if(document.pressed == 'Save')
{
document.myform.action ="jbupdate.php";
} else
if(document.pressed == 'Print')
{
document.myform.action ="ppage.php";
}
return true;
}
</script>
and these are my submit buttons
这些是我的提交按钮
<input type="submit" name="operation" onclick="document.pressed=this.value" value="Save" />
<input type="submit" name="operation" onclick="document.pressed=this.value" value="Print" />
I will like to POST this information to these action pages depending on the button pressed.
我想根据按下的按钮将此信息发布到这些操作页面。
回答by T.J. Crowder
If you look in the JavaScript console, you'll see an error message when you try to submit the form that will tell you a big part of what's wrong: In your form's submithandler, you're trying to call a function called onsubmitform:
如果您查看 JavaScript 控制台，当您尝试提交表单时会看到一条错误消息，该消息会告诉您错误的很大一部分：在表单的submit处理程序中，您正在尝试调用一个名为 的函数onsubmitform：
<form name="myform" onsubmit="return onsubmitform();">
<!-- ^--- here -->
...but your function is actually called submitform:
...但你的函数实际上是被调用的submitform：
<script type="text/javascript">
function submitform()
// ^--- here
If you make those names match, it'll probably mostly work, although I'm not entirelysure expecting the submit button's clickevent to fire prior to the form's submithandler is entirely reliable cross-browser.
如果您使这些名称匹配，它可能大部分都可以工作，尽管我不完全确定期望提交按钮的click事件在表单submit处理程序之前触发是完全可靠的跨浏览器。
FWIW, though, I'd probably do it differently. Since you say you're using jQuery, I'd ditch the global submitformfunction entirely, add a hidden field, and make the buttons just buttons (rather than submit buttons) since your form is already non-functional unless JavaScript is enabled.
不过，FWIW，我可能会以不同的方式做。既然你说你在使用 jQuery，我会submitform完全放弃全局函数，添加一个隐藏字段，并使按钮只是按钮（而不是提交按钮），因为除非启用 JavaScript，否则你的表单已经不起作用。
So:
所以：
<input type="hidden" name="operation" value="" />
<input type="button" value="Save" />
<input type="button" value="Print" />
with:
和：
jQuery(function($) {
var form = document.myform;
$(form).find("input[type='button']").click(function() {
form.operation = this.value;
form.action = this.value == 'Save' ? 'jbupdate.php' : 'ppage.php';
form.submit();
return false;
});
});
回答by Kris
The following javascript function takes the URL of the target page and an associative array of name/values pairs and POSTs the data to the supplied URL by dynamically creating a form and then submitting it.
以下 javascript 函数获取目标页面的 URL 和名称/值对的关联数组，并通过动态创建表单然后提交表单将数据发布到提供的 URL。
You can use instead of submit, two input buttons. On click of the buttons, u can mannualy change the action part to whatever you want, and then submit it.
您可以使用两个输入按钮代替提交。单击按钮，您可以手动将操作部分更改为您想要的任何内容，然后提交。
var myForm = document.getElementById(formid);
myForm.action = to-wherever-u-want ;
myForm.submit() ;
Write two functions, with different actions, or write one function, determine which btn was pressd.
写两个函数，用不同的动作，或者写一个函数，判断哪个btn被按下了。
Your script was having some errors like that you called onsubmitform(), but you only have sumitform() in defenition. Pls take care of that too.
你的脚本有一些错误，比如你调用了 onsubmitform()，但你只有 sumitform() 在 defenition。请也照顾好这一点。
回答by Brad Irby
Here's another option:
这是另一种选择：
<form action="ThisActionIsReplacedInTheButtonOnclickEvent" method="POST" Name="MyForm" target="_blank" >
...
<input type="submit" name="MyBtn" value="do it" OnClick="document.forms['MyForm'].action = 'Destination1.aspx'" >
<input type="submit" name="MySecondBtn" value="do it different" OnClick="document.forms['MyForm'].action = 'Destination2.aspx'" >
BTW, IE doesn't seem to like inline js much, so you may have to break the form.action assignment out into a separate function like this:
顺便说一句，IE 似乎不太喜欢内联 js，因此您可能必须将 form.action 分配分解为一个单独的函数，如下所示：
<input type="submit" name="doitbtn" value="do it" OnClick="SetDest1()" />
<SCRIPT LANGUAGE="JavaScript">
function SetDest1() {
document.forms["MyForm"].action = "Destination1.aspx";
}
function SetDest2() {
document.forms["MyForm"].action = "Destination2.aspx";
}
</script>
回答by Marc Gravell
More simply:
更简单：
<input type="submit" formaction="someaddress/whataver" value="Do X"/>
<input type="submit" formaction="/another/address" value="Do Y"/>
回答by Ryan
Probably a tweaked version of the below code will help. I added the alerts for testing.
以下代码的调整版本可能会有所帮助。我添加了测试警报。
$('form[name="myform"] input[type="submit"]').click(function(event){
var $form = $('form[name="myform"]');
if($(this).val()=='Print'){
alert('print was pressed') ;
$form.attr('action','jbupdate.php');
}
else{
alert('save was pressed') ;
$form.attr('action','ppage.php');
}
});
//I added the following code just to check if the click handlers are called
//before the form submission, The alert correctly shows the proper value.
$('form[name="myform"]').submit(function(event){
alert("form action : " + $(this).attr('action'));
//event.preventDefault();
});
You can play with the fiddle at http://jsfiddle.net/ryan_s/v4FtD/
回答by 19greg96
<form name="myform" onsubmit="return onsubmitform();">
your functions name is not onsubmitform(), its submitform()
您的函数名称不是 onsubmitform()，而是它的 submitform()
and if you want to post data, I suggest you add method="post"
如果你想发布数据，我建议你添加 method="post"
<form name="myform" onsubmit="return submitform();" method="post">
good luck ;)
祝你好运 ;）
