Question

我目前的代码如下：

<div class="fr_search">   
  <form action="/"  accept-charset="UTF-8" method="post" id="search-theme-form">
  .......
  </form>
</div>

现在我想编写一个函数来在满足条件时更改表单操作和方法。我该如何编写这段代码？

例如，

function test() {
   if (selectedIndex === 1)....
} // How do I write this code?

Answer 1

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";
    }
}

并且您的表单需要name就是这种情况

<form action="/"  accept-charset="UTF-8" method="post" name="search-theme-form" id="search-theme-form">

Answer 2

试试这个：

var frm = document.getElementById('search-theme-form') || null;
if(frm) {
   frm.action = 'whatever_you_need.ext' 
}

Answer 3

我想使用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(); 
  }
}

表格形式：

<input type="submit" onclick='setAction(this,"my-page")' value="Click Me!" />

以下是我的Apache重写规则：

RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} !-f
RewriteRule ^/(.*)$ %{DOCUMENT_ROOT}/index.pl?page=$1&%{QUERY_STRING}

我对任何解释为什么只是设置行动不起作用感兴趣。

Answer 4

如果你正在使用jQuery，那就像这样简单：

$('form').attr('action', 'myNewActionTarget.html');

Answer 5

 // 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.

如何使用JavaScript来更改表单操作

5 个答案: