Question

我有这样的代码：

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

我想设置一个操作，以便在选择一个选项时将用户定向到checkin.php页面而不必使用提交按钮。我被告知要使用onChange，但我不知道如何使用它。

Answer 1

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

这个怎么样？

Answer 2

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

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

该功能会检查您在尚未更改为占位符条目的选择IE中的值。如果New Room不是占位符，我建议制作一个，否则无论是否有值检查都无法访问。

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

您转到此表单并选择＆＃34; Room 1＆＃34;
表单已自动提交，您转到checkin.php
您改变主意并点击后退按钮
浏览器会记住表单的状态以及＆＃34; Room 1＆＃34;选项仍然被选中
您将下拉菜单更改回＆＃34;新房间＆＃34;表格检测到变更并提交。

编辑：另请注意，您缺少结束</select>代码。

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

2 个答案: