如何使用JavaScript onchange事件提交表单？_Javascript_Forms_Select_Input_Onchange

如何使用JavaScript onchange事件提交表单？

javascript forms select input

如何使用JavaScript onchange事件提交表单？,javascript,forms,select,input,onchange,Javascript,Forms,Select,Input,Onchange,我有这样的代码： <form action="checkin.php" method="post"> <select name="roomname" onchange="???"> <option value="">New Room:</option> <option value="room1">Room 1:</option> <option value="ro

我有这样的代码：

<form action="checkin.php" method="post">
    <select name="roomname" onchange="???">
        <option value="">New Room:</option>
        <option value="room1">Room 1:</option>
        <option value="room2">Room 2:</option>
</form>


新房间：
第1房间：
第2会议室：

我想设置一个操作，这样当选择一个选项时，用户就可以直接进入

checkin.php

页面，而不必使用提交按钮。有人告诉我在更改时使用

onChange

，但我不知道如何使用它。


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

...

这个怎么样？

您可以使用这个简单的函数。它应该足够通用，也适用于其他形式：

<head>
  <script>
      function submitForm(elem) {
          if (elem.value) {
              elem.form.submit();
          }
      }
  </script>
</head>
<body>
  <form action="checkin.php" method="post">
    <select name="roomname" onchange="submitForm(this)">  
      <option value="">New Room:</option>
      <option value="room1">Room 1:</option>
      <option value="room2">Room 2:</option>
    </select>
  </form>
</body>


函数提交表单（elem）{
if（元素值）{
元素表单提交（）；
}
}
新房间：
第1房间：
第2会议室：

该函数检查您在select IE中是否有值，即您是否未更改为占位符条目。如果

新房间

不是占位符，我建议创建一个，否则无论是否检查值，都无法访问

基本上，这些函数会停止以下行为：

请转到此表单并选择“1号房间”

表单将自动提交，您可以进入

checkin.php

你改变主意，按下后退按钮

浏览器会记住表单的状态，“房间1”选项仍处于选中状态

您将下拉列表更改回“New Room”，表单将检测到更改并提交

编辑：还请注意，您缺少一个结束标记。

请修改您文章的最后一部分。我不知道你想问什么。是否“新房间”也是一个可提交的选项？它应该使用onchange自动提交吗？您应该知道，您不能更改为页面加载时选择的同一选项，因此无论哪个选项是默认选项，都将无法访问。我建议使用占位符，例如：没有值，文本为：“选择房间”请不要。如果要对更改事件做出反应，请将新内容加载到页面中，并将下拉列表保留在那里。我讨厌意外的重装。尤其是当我因为打错了而不得不返回时。尤其是当页面和/或我的设备速度非常慢时。