如何使用 JavaScript 更改表单操作
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5361751/
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
How to use JavaScript to change the form action
提问by enjoylife
My current code is as follows:
我目前的代码如下:
<div class="fr_search">
<form action="/" accept-charset="UTF-8" method="post" id="search-theme-form">
.......
</form>
</div>
Now I want to write a function to change the form action and method, when a condition is met. How do I write this code?
现在我想编写一个函数来在满足条件时更改表单操作和方法。我该如何编写这段代码?
For example,
例如,
function test() {
if (selectedIndex === 1)....
} // How do I write this code?
回答by bensiu
function chgAction( action_name )
{
if( action_name=="aaa" ) {
document.search-theme-form.action = "/AAA";
}
else if( action_name=="bbb" ) {
document.search-theme-form.action = "/BBB";
}
else if( action_name=="ccc" ) {
document.search-theme-form.action = "/CCC";
}
}
and your form need to have name
is this case
你的表格需要有name
这种情况
<form action="/" accept-charset="UTF-8" method="post" name="search-theme-form" id="search-theme-form">
回答by i100
Try this:
尝试这个:
var frm = document.getElementById('search-theme-form') || null;
if(frm) {
frm.action = 'whatever_you_need.ext'
}
回答by Tejs
If you're using jQuery, it's as simple as this:
如果您使用的是 jQuery,它就像这样简单:
$('form').attr('action', 'myNewActionTarget.html');
回答by Waz
I wanted to use Javascript change a form's action, so I could have different submit inputs within the same form linking to different pages. I also had the added complication of using Apache rewrite to change example.com/page-name
into example.com/index.pl?page=page-name
. I found that changing the form's action caused example.com/index.pl
(with no page parameter) to be rendered, even though the expected URL (example.com/page-name
) was displayed in the address bar. To get around this, I used Javascript to insert a hidden field to set the page parameter. I still changed the form's action, just so the address bar displayed the correct URL.
我想使用 Javascript 更改表单的操作,因此我可以在链接到不同页面的同一表单中使用不同的提交输入。我还增加了使用 Apache 重写更改example.com/page-name
为example.com/index.pl?page=page-name
. 我发现更改表单的操作会导致example.com/index.pl
(没有页面参数)呈现,即使预期的 URL ( example.com/page-name
) 显示在地址栏中。为了解决这个问题,我使用 Javascript 插入一个隐藏字段来设置页面参数。我仍然更改了表单的操作,以便地址栏显示正确的 URL。
function setAction (element, page)
{
if(checkCondition(page))
{
/* Insert a hidden input into the form to set the page as a parameter.
*/
var input = document.createElement("input");
input.setAttribute("type","hidden");
input.setAttribute("name","page");
input.setAttribute("value",page);
element.form.appendChild(input);
/* Change the form's action. This doesn't chage which page is displayed,
* it just make the URL look right.
*/
element.form.action = '/' + page;
element.form.submit();
}
}
In the form:
在形式:
<input type="submit" onclick='setAction(this,"my-page")' value="Click Me!" />
Here are my Apache rewrite rules:
这是我的 Apache 重写规则:
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} !-f
RewriteRule ^/(.*)$ %{DOCUMENT_ROOT}/index.pl?page=&%{QUERY_STRING}
I'd be interested in any explaination as to why just setting the action didn't work.
我对任何关于为什么设置操作不起作用的解释感兴趣。
回答by ashraf mohammed
// i assume that you want to change form action based on drop-down choice
function change_action(form1){
if(form1.mydropdown_name.selectedIndex===1){
form1.action = "aaaa.php";
}else{
form1.action = "bbbb.php";
}
}
//how to use
<select name='mydropdown_name' id='mydropdown_id' onchange="change_action(this.form)"><option value="1">first</option><option value="2">second</option></select>
//this way you do not have to provide js function with form name.