如何将输入给定值获取到数组答案

【问题标题】：how to fetch Input given value to an array如何将输入给定值获取到数组
【发布时间】：2020-08-13 02:10:09
【问题描述】：

我正在使用基于一些 Json 数据的计算器，当我输入经度和纬度时，我得到了与该经度和纬度相关联的网格代码。问题是当我从输入中获取值时，结果返回为 0 表示输入的值未定义

这就是我的代码的样子

<!DOCTYPE html>
<html>
<head>

</head>
<body>


<form action="" id="my-form">
  <div class="form-group">
    <label for="">Enter Lat</label>
    <input type="text" id="lat" step="any">
    <label for="">Enter Long</label>
    <input type="textr" id="long" step="any">

  </div>
  <input type="button" id="Btn" value="Calculate" >
  <h2 id="result">result</h2>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
var desiredLat = document.getElementById("lat").value,
desiredLong = document.getElementById("long").value;
  const
  myData = {
   "datagrid": [
     { "GRIDCODE": 1735,"lat": 35.91511132, "long": -5.401484264 },
     { "GRIDCODE": 1805, "lat": 35.90677815, "long": -5.468149593 },
     { "GRIDCODE": 1808, "lat": 35.90677815, "long":-5.459816427 },
     { "GRIDCODE": 1784, "lat": 35.89844499, "long":-5.476482759 }
   ]
 };

  gridcode = lookupGridcodeByLatAndLong(myData.datagrid),
  headerHTML = gridcode ;
console.log(headerHTML);



function lookupGridcodeByLatAndLong(sourceArray){
  let gridcode = 0;
  
  for (let currentObject of sourceArray){
    if (currentObject.lat === desiredLat && currentObject.long === desiredLong){
      gridcode = currentObject.GRIDCODE;
    }
  }
 
  return gridcode;
}
$("#Btn" ).click(function() {
  $("#result").html(gridcode);
});

</script>
</body>
</html>

【问题讨论】：

您是否在控制台中遇到任何错误？您是否能够找到主要问题可能出在哪一行？
我得到了答案，兄弟很感激，问题是我第一次调用lookupGridcodeByLatAndLong函数并传递了lat和lang值，这两个值都将返回未定义，因为我还没有输入它们。跨度>

标签： javascript jquery arrays input

【解决方案1】：

你得到zero值的原因是因为你在第一次调用你的lookupGridcodeByLatAndLong函数时传递了你的lat和lang值，这两个值都将返回未定义，因为你还没有输入它们.

您必须用值填充它们，然后单击按钮以获取 lat 和 lang 值，然后再进行计算以获取 GRIDCODE，实际上您不需要将对象值解析为参数，因为你把它初始化为全局参数，所以你仍然可以在你的函数中使用它而不用解析它。

<!DOCTYPE html>
<html>
<head>

</head>
<body>


<form action="" id="my-form">
  <div class="form-group">
    <label for="">Enter Lat</label>
    <input type="text" id="lat" step="any">
    <label for="">Enter Long</label>
    <input type="textr" id="long" step="any">

  </div>
  <input type="button" id="Btn" value="Calculate" >
  <h2 id="result">result</h2>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
  const
  myData = {
   datagrid: [
     { "GRIDCODE": 1735,"lat": 35.91511132, "long": -5.401484264 },
     { "GRIDCODE": 1805, "lat": 35.90677815, "long": -5.468149593 },
     { "GRIDCODE": 1808, "lat": 35.90677815, "long":-5.459816427 },
     { "GRIDCODE": 1784, "lat": 35.89844499, "long":-5.476482759 }
   ]
 };



function lookupGridcodeByLatAndLong(lat, long){
  let gridcode = 0;
  
  var result = myData.datagrid.find(x => x.lat == lat && x.long == long)
  if (result) {
    gridcode = result.GRIDCODE;
  }
 
  return gridcode;
}
$("#Btn" ).click(function() {
	var lat = document.getElementById("lat").value,
	long = document.getElementById("long").value;
	var result = lookupGridcodeByLatAndLong(lat, long)
  $("#result").html(result);
});

</script>
</body>
</html>

【讨论】：

我已经编辑了我的答案，没有解析对象，你可以再试一次
它适用于像他给定的小数据，但我使用的是超过 900000 行数据，因此它需要很长时间才能找到价值
我尝试使用js函数中的find，也许你可以尝试实现它..让我们检查它是否成功
喜欢它应该在找到第一个匹配项时停止搜索
yap 如果您想仅使用 filter 而不是 find 获取数组值