Question

我正在尝试根据jsfiddle上的Vikrant脚本进行javascript表单验证。

我也在jsfiddle上创建了自己的脚本here它与他的代码非常相似但由于某种原因，警报永远不会触发，即使它不应该提交表单。

这也发生在我的本地主机上。

这里也是代码：

function FormValidasi() {
  if (document.getElementById('cabang').value == "tor") {
    alert("Mohon pilih cabang nya");
    return false;
  } else if (document.getElementById('tipe').value == "tor") {
    alert("Mohon pilih tipenya");
    return false;
  }
  return (true);
}

<form name="Formulir" method="post" action="2013.php" onsubmit="return FormValidasi();">
  <input type="text" name="cabang" id="cabang" placeholder="Input cabang">
  <br>
  <input type="text" name="tipe" id="tipe" placeholder="Input Tipe">
  <input type="submit" name="submit" value="submit">
</form>

因此，如果我在两个字段中输入"tor"，或只在字段中输入一个，则脚本应为returning false并阻止表单提交？但即使我输入"tor"

，表单也会提交

Answer 1

不使用代码的原因是您在此处编写的代码为return (true); JS的代码执行检查IF条件并且仅返回一个从那里输出。从您始终return true表示脚本执行IF语句但最终return true的行，即使您的输入字段有错误。

＆＃13;
＆＃13;
function FormValidasi() { if (document.getElementById('cabang').value == "tor") { alert("Mohon pilih cabang nya"); return false; } else if (document.getElementById('tipe').value == "tor") { alert("Mohon pilih tipenya"); return false; } }
＆＃13;
<form name="Formulir" method="post" action="2013.php" onsubmit="return FormValidasi();"> <input type="text" name="cabang" id="cabang" placeholder="Input cabang"> <br> <input type="text" name="tipe" id="tipe" placeholder="Input Tipe"> <input type="submit" name="submit" value="submit"> </form>
＆＃13;
＆＃13;
＆＃13;

更新1

2个用户已经做出了合理的论证，并且我已经更新了代码段，以避免出现如下错误。

未捕获的ReferenceError：未在HTMLFormElement.onsubmit中定义FormValidasi

这可以避免将表单提交验证功能作为全局功能。

window.FormValidasi = FormValidasi;

更新代码：

＆＃13;
＆＃13;
window.FormValidasi = FormValidasi; function FormValidasi() { if (document.getElementById('cabang').value == "tor") { alert("Mohon pilih cabang nya"); return false; } else if (document.getElementById('tipe').value == "tor") { alert("Mohon pilih tipenya"); return false; } }
＆＃13;
<form name="Formulir" method="post" action="2013.php" onsubmit="return FormValidasi();"> <input type="text" name="cabang" id="cabang" placeholder="Input cabang"> <br> <input type="text" name="tipe" id="tipe" placeholder="Input Tipe"> <input type="submit" name="submit" value="submit"> </form>
＆＃13;
＆＃13;
＆＃13;

详细了解onsubmit function is not defined
上的功能错误
更新2

感谢您再次考虑代码。 OP具有正确定义的功能。因为问题是他的功能没有正确执行完全是由于js的不幸。通过创建函数global可以避免它。

Answer 2

总结以前接受的答案及其评论，正确的代码应为：

的Javascript

window.FormValidasi = FormValidasi;

function FormValidasi() {
  if (document.getElementById('cabang').value == "tor") {
    alert("Mohon pilih cabang nya");
    return false;
  } else if (document.getElementById('tipe').value == "tor") {
    alert("Mohon pilih tipenya");
    return false;
  }
  return true;
}

HTML

<form name="Formulir" method="post" action="2013.php" onsubmit="return FormValidasi();">
  <input type="text" name="cabang" id="cabang" placeholder="Input cabang">
  <br>
  <input type="text" name="tipe" id="tipe" placeholder="Input Tipe">
  <input type="submit" name="submit" value="submit">
</form>

问题是不正在执行的函数的最后一行总是返回true，如接受答案的第一段所述，而是首先是编码错误导致函数无法执行。

即使条件匹配，javascript表单验证也始终返回true，并且应该返回false

2 个答案: