Question

如果我有一个包含2个按钮的表单，当我单击Button1时，它将是action="submit1.php"，如果Button2然后是action="submit2.php"。

我试过了：

  <script language="javascript">

  function Button1()
   {
     document.Form1.action = "submit1.php"   
     document.Form1.target = "iframe1";    
     document.Form1.submit();        

   }

  function Button2()
   {
    document.Form1.action = "submit2.php" ;
    document.Form1.target = "iframe2";    
    document.Form1.submit();       
   }

 </script>

<body>中的某个地方：

  <div style="visibility:hidden">
  <iframe NAME="iframe1" WIDTH="40" HEIGHT="40"></iframe>
  <iframe NAME="iframe2" WIDTH="40" HEIGHT="40"></iframe>
  </div>

以表格形式：

  <form name="Form1" id="Form1" method="post">
  <input type="submit" name="Button1" onclick="Button1();">
  <input type="submit" name="Button2" onclick="Button2();">
  </form>

它没有用，我做错了吗？

谢谢。

Answer 1

你有两个问题

EITHER

将按钮更改为type =“button”

OR

从功能中删除提交

Plain JS（使用更简单的表单访问）：

<script language="javascript">
function Button(theButton) {
  var theForm = theButton.form;
  if (theButton.name=="Button1") {
    theForm.action = "submit1.php"   
    theForm.target = "iframe1";    
  }
  else {
    theForm.action = "submit2.php"   
    theForm.target = "iframe2";    
  }
}
</script>

<form method="post" action="nojsavailable.php">
  <input type="submit" name="Button1" onclick="Button(this);" />
  <input type="submit" name="Button2" onclick="Button(this);" />
</form>

不引人注目（推荐）：

<script language="javascript">
window.onload=function() {
  var buttons = document.getElementsByName("button");
  for (var i=0;i<buttons.length;i++) {
    buttons[i].onclick=function() {
      var idx = i+1;
      var theForm = this.form;
      theForm.action = "submit"+idx+".php"   
      theForm.target = "iframe"+idx;    
    }
  }
}
</script>

<form method="post" action="nojsavailable.php">
  <input type="submit" name="button" id="button1" />
  <input type="submit" name="button" id="button2" />
</form>

Answer 2

我建议改用element.setAttribute('attributeName','attributeValue');。此外，在这种情况下您不需要使用form.submit();，提交按钮仍会提交表单，只需要在onclick方法中return true。

尝试：

 function Button1()
   {
     document.getElementById('Form1').setAttribute('action',"submit1.php");
     document.getElementById('Form1').setAttribute('target',"iframe1");

   }

  function Button2()
   {
     document.getElementById('Form2').setAttribute('action',"submit2.php");
     document.getElementById('Form2').setAttribute('target',"iframe2");   
   }

Answer 3

用户小功能名称。 Javascript似乎让Button1函数与Button1对象混淆。所以你的解决方案将是

 <script language="javascript">

  function button1()
   {
     document.Form1.action = "submit1.php"   
     document.Form1.target = "iframe1";    
     document.Form1.submit();        

   }

  function button2()
   {
    document.Form1.action = "submit2.php" ;
    document.Form1.target = "iframe2";    
    document.Form1.submit();       
   }

 </script>

并以表格

<form name="Form1" id="Form1" method="post">
  <input type="button" id="Button1" name="button1()" />
  <input type="button" id="Button2" name="button2()" />
</form>

Answer 4

这将是您的最终代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
  <script language="javascript">

  function button1()
   {
     document.Form1.action = "http://www.google.com"   
     document.Form1.target = "iframe1";    
     document.Form1.submit();        

   }

  function button2()
   {
    document.Form1.action = "http://www.yahoo.com" ;
    document.Form1.target = "iframe2";    
    document.Form1.submit();       
   }

 </script>
</head>
<body>
  <form name="Form1" id="Form1" method="post">

  <input type="button" value="btn1" name="Button1" onclick="button1()">
  <input type="button" value="btn2" name="Button2" onclick="button2()">  

  </form>
</body>
</html>

根据不同的提交按钮不同的表单动作

4 个答案: