关于javascript：如何检查JS中缺少的变量？


How to Check for a missing variable In JS?

本问题已经有最佳答案，请猛点这里访问。

我正在尝试在允许表单提交之前检查变量是否存在。

目前，用户在表单中输入地址，自动完成功能会在表单中添加lat和long。我写了以下JS

1
2
3
4
5
6
7
8
9
10
function check() {
    let latitude = document.getElementById("latitude").value;
    if (latitude == null) {
        window.prompt("ned a correct address","");
        return false;
    } else {
        alert('It worked');
        return true;
    }
}

当我提交一个没有lat和长时间自动完成的地址时，我仍然得到"它工作了"。

这是我的表格

1
2
3
4
5
<form method="GET" action="/search" onsubmit="check()">
    <input class="form-control" id="getaddy" type="text" placeholder="Search..." name="term" onFocus="geo()">
    <input id="latitude" type="hidden" name="latitude">
    <input id="longitude" type="hidden" name="longitude">
</form>
相关讨论

如果您真的想检查变量是否存在，有一种安全的方法可以这样做，方法是使用：

1
2
3
4
5
if(variable) {
  // Truthy
} else {
  // Falsy
}

这样，您可以得到所有可能的Falsy场景，包括：null、undefined、NaN、""、0，最后是false本身……不检查每一个！

下面是编辑的代码段：

1
2
3
4
5
6
7
8
9
10
function check() {
  let latitude = document.getElementById("latitude").value;
  if (latitude) {
    alert('It worked');
    return true;
  } else {
    window.prompt("ned a correct address","");
    return false;
  }
}
1
2
3
4
5
<form method="GET" action="/search" onsubmit="check()">
  <input class="form-control" id="getaddy" type="text" placeholder="Search..." name="term" onFocus="geo()">
  <input id="latitude" type="hidden" name="latitude">
  <input id="longitude" type="hidden" name="longitude">
</form>

*此代码只执行一次！

相关讨论

为了更可靠的表单验证，这里有一些事情需要考虑；

  • 如果验证失败，建议使用事件对象取消提交操作
  • 通过"空字符串"而不是null的测试验证输入字段值
  • 确保脚本中没有抛出错误(即确保定义了geo()等)，以便实际调用check()，而不是由于另一个脚本错误而默默无语地无法调用。

    • 以下更改可能会有所帮助：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    // Pass event object
    function check(event) {
     
      let address = document.getElementById("getaddy").value;
     
      // Check for empty string, rather than null
      if (address === '') {
        window.prompt("ned a correct address","");
         
        // Use Event#preventDefault() to prevent submit
        // as a more reliable alternative to returning
        // false
        event.preventDefault();
      } else {
     
        alert('It worked');
      }
    }


    // Ensure geo() is defined, seeing your form is relying on this
    function geo() { }
    1
    2
    3
    4
    5
    6
    7
    8
    <!-- update check call to pass event object -->
    <form method="GET" action="/search" onsubmit="check(event)">

      <input class="form-control" id="getaddy" type="text" placeholder="Search..." name="term" onFocus="geo()">
      <input id="latitude" type="hidden" name="latitude">
      <input id="longitude" type="hidden" name="longitude">
     
    </form>