更改提交时的下拉列表不执行php代码

Question

我有一张表格

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" enctype="multipart/form-data"> 

表单有多个输入类型文本和一个下拉菜单。

我还有一个名为（submit1）的提交按钮

<input class="submit-button" type="submit" name="submit1" value="UPDATE MY INFORMATION" />

我的PHP读起来是这样的：

if (isset($_POST['submit1'])) 
{ .... }

如果我按下按钮，它就工作了，没问题。

但我也想从下拉菜单中提交表格更改。。。因此，它可以通过按下按钮或更改下拉列表来执行。。。所以我的下拉列表如下

<select name="country"  onchange="this.form.submit()">

当我选择我的下拉列表时，页面刷新，但是PHP中的代码没有执行。。。我想这和$u POST['submit1']的名字有关。。。

如何更改onchange=“this.form.submit（），使其在if（isset（$\u POST['submit1'））中执行代码。。。

非常感谢。

Answer 1

检查isset（$_POST['国家']）并在更改时将其添加到下拉列表中，

onchange= 'document.getElementsByName("submit1")[0].click();'

Answer 2

您只需文档即可。getElementById（'submit1'）。将submit按钮上的id设置为与其名称相同后，单击（）。当然，您也可以在更改时执行此操作。我会将我的JavaScript与HTML分开，这样它就会缓存到浏览器内存中。除了单选按钮和可能的复选框外，为您的输入、选择等提供与其名称相同的id。

让我们从一些常见的开始。js：

//<![CDATA[
var doc = document, bod = doc.body;
var IE = parseFloat(navigator.appVersion.split('MSIE')[1]);
bod.className = 'js';
function gteIE(version, className){
  if(IE >= version)bod.className = className;
}
function E(e){
  return doc.getElementById(e);
}
//]]>

现在进入其他页面。php：

//<![CDATA[
var cntry = E('country'), sub1 = E('submit1');
cntry.onchange = function(){
  sub1.click();
}
// note that the format E('submit1').click(); would also work
//]]>

当然，你应该有：

  <script type='text/javascript' src='common.js'></script>
  <script type='text/javascript' src='otherpage.js'></script>
</body>
</html>

Answer 3

您应该避免这样的内联javascript。它很难看，并且降低了可读性。更简单的方法是为元素提供ID，如下所示：

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" enctype="multipart/form-data" id="myForm"> 

但是如果您不想，可以使用QuerySelector获取输入的name属性。

var x = document.querySelector("[name='country']");
x.addEventListener("change",function() {
    this.parentNode.submit(); //get form parent and submit
});

我有点困惑，为什么还要检查submit按钮的值，您不想：

if (isset($_POST['country'])) { ... }

相反？