Question

我有一个带有选择的表格：

<form name="form" method="post" action="registr.php">
  <select name="type">
    <option value="std">Standard</option>
    <option value="stud">Student</option>
    <option selected hidden value=""></option>
  </select>
  <input type="submit" value="Invia" onclick="return validation();">
</form>

我必须检查使用javaScript函数发送的数据。如果我没有选择学生或标准生，则该表格必须返回false。这是函数，但是不起作用：

function validation() {
  var type = document.form.type.value;
  if (type == "") {
    return false;
  }
  return true;
}

Answer 1

您应该将对验证功能的调用添加到表单本身的Submit事件中-而不是直接添加到按钮上。如果未选择学生或标准，则以下示例将打开一个警报对话框。

function validation() {
  var type = document.form.type.value;
  if (type == "") {
    alert("Please select something");
    return false;
  }
  return true;
}

<form name="form" method="post" action="registr.php" onsubmit="return validation();">
  <select name="type">
    <option value="std">Standard</option>
    <option value="stud">Student</option>
    <option selected hidden value=""></option>
  </select>
  <input type="submit" value="Invia">
</form>

Answer 2

只需在表单标签onsubmit中调用验证方法，因为如果表单为false，则它将不提交，否则它将提交。

<form name="form" method="post" onsubmit="return validation();" action="registr.php">
<select name="type">
<option value="std">Standard</option>
<option value="stud">Student</option>
<option selected hidden value=""></option>
</select>
<input type="submit" value="Invia">
</form>

Answer 3

您的脚本确实起作用，您也可以尝试将id添加到选择选项：

function validation() {
  var id = document.getElementById("selecttype");
  var type = id.options[id.options.selectedIndex].value;
  if (type == "") {
    return false;
  }
  return true;
}

  

<form name="form" method="post" action="registr.php">
  <select name="type" id="selecttype">
    <option value="std">Standard</option>
    <option value="stud">Student</option>
    <option selected hidden value=""></option>
  </select>
  <input type="submit" value="Invia" onclick="return validation();">
  </form>

Answer 4

似乎您错误地访问了选择字段。试试这个

var type = document.forms[0].elements.type.value;

如何从多个选择HTML

4 个答案: