Question

如何使用输入值获取json对象的索引？！

实际上，当用户输入为2时，我的Javascript将打印：来自JSON的第二个问题，ID为2，索引为1，之后当他点击下一步时，他将获得第3个问题，ID为：3，索引2等。

但是因为我需要在课程中添加一些问题（很多主题），我不能一遍又一遍地更改id或在最后一个之后添加问题。

所以我需要使用id搜索问题...而不是索引编号。因此，如果用户输入为2，我的js schould打印：来自JSON的第3个问题，ID为2，索引2，之后当他点击下一步时，他将得到第4个问题，id为：9，索引3等。

HTML - 输入值（用户选择ID号）：

stdbuf -oL wpa_cli

实际上，当用户输入为2时，我的Javascript将打印：来自JSON的第3个问题，之后当他点击下一个时他会得到第4个问题等。

来自档案的GetJson：

<input type="text" placeholder="Question Number" name="search" id="searchid" >
  <button type="submit" id="idnumber"><i class="fa fa-search"></i></button>

JSON：

$.getJSON("question.json", function(response) {
      json = response;
      populate(json.Math[val]);

  });

已经尝试过（jQuery）：

{"Math":[
    {   "title":"Math",
        "subtitle": "some",
        "subtitle2" : "some2",
        "id": "1", 
        "question":"2+2:",
        "opt01": "5",
        "opt02": "22",
        "opt03": "4",
        "opt04": "3",
        "opt05": "1",
        "correct": "4"
         }, 
        { "title":"Math",
        "subtitle": "some",
        "subtitle2" : "some2",
        "id": "4", 
        "question":"2+12:",
        "opt01": "5",
        "opt02": "22",
        "opt03": "14",
        "opt04": "3",
        "opt05": "1",
        "correct": "14"
         },  { "title":"Math",
        "subtitle": "some",
        "subtitle2" : "some2",
        "id": "2", 
        "question":"21+2:",
        "opt01": "5",
        "opt02": "23",
        "opt03": "4",
        "opt04": "3",
        "opt05": "1",
        "correct": "23"
         },  { "title":"Math",
        "subtitle": "some",
        "subtitle2" : "some2",
        "id": "9", 
        "question":"2-2:",
        "opt01": "5",
        "opt02": "22",
        "opt03": "4",
        "opt04": "0",
        "opt05": "1",
        "correct": "0"
         },  { "title":"Math",
        "subtitle": "some",
        "subtitle2" : "some2",
        "id": "15", 
        "question":"(2+2)*10:",
        "opt01": "5",
        "opt02": "22",
        "opt03": "40",
        "opt04": "3",
        "opt05": "1",
        "correct": "40"
         }]}

对于快速输出我尝试“警告”，但每次我输入一些数字我的结果是-1 ??

Answer 1

您可以使用find()在数组中找到项目。它接受一个函数，将每个项传递给函数，并返回函数返回true的第一个对象。所以，如果你想找到问题ID 2，你可以：

let qs = {"Math":[{   "title":"Math","subtitle": "some","subtitle2" : "some2","id": "1", "question":"2+2:","opt01": "5","opt02": "22","opt03": "4","opt04": "3","opt05": "1","correct": "4" }, { "title":"Math","subtitle": "some","subtitle2" : "some2","id": "4", "question":"2+12:","opt01": "5","opt02": "22","opt03": "14","opt04": "3","opt05": "1","correct": "14" },  { "title":"Math","subtitle": "some","subtitle2" : "some2","id": "2", "question":"21+2:","opt01": "5","opt02": "23","opt03": "4","opt04": "3","opt05": "1","correct": "23" },  { "title":"Math","subtitle": "some","subtitle2" : "some2","id": "9", "question":"2-2:","opt01": "5","opt02": "22","opt03": "4","opt04": "0","opt05": "1","correct": "0" },  { "title":"Math","subtitle": "some","subtitle2" : "some2","id": "15", "question":"(2+2)*10:","opt01": "5","opt02": "22","opt03": "40","opt04": "3","opt05": "1","correct": "40" }]}

function getQuesionID(id) {
    return qs.Math.find(q => q.id = id)
}
// question 2
console.log(getQuesionID(2))

这很简单，但你也有一个问题，你想要下一个问题，可能是也可能不是第3号，对吧？如果没有三个你想要4或5或下一个是什么。迟早你会发现你应该为你的问题使用更好的数据结构。由于您的问题是按ID排序的，因此按ID排序的数组更有意义并且效率更高。

您可以使用以下方式对问题进行排序：

qs.Math.sort((a,b) => a.id - b.id)

这将让您找到ID大于或等于用户请求的问题。所以要求3将提供4：

let qs = {"Math":[{   "title":"Math","subtitle": "some","subtitle2" : "some2","id": "1", "question":"2+2:","opt01": "5","opt02": "22","opt03": "4","opt04": "3","opt05": "1","correct": "4" }, { "title":"Math","subtitle": "some","subtitle2" : "some2","id": "4", "question":"2+12:","opt01": "5","opt02": "22","opt03": "14","opt04": "3","opt05": "1","correct": "14" },  { "title":"Math","subtitle": "some","subtitle2" : "some2","id": "2", "question":"21+2:","opt01": "5","opt02": "23","opt03": "4","opt04": "3","opt05": "1","correct": "23" },  { "title":"Math","subtitle": "some","subtitle2" : "some2","id": "9", "question":"2-2:","opt01": "5","opt02": "22","opt03": "4","opt04": "0","opt05": "1","correct": "0" },  { "title":"Math","subtitle": "some","subtitle2" : "some2","id": "15", "question":"(2+2)*10:","opt01": "5","opt02": "22","opt03": "40","opt04": "3","opt05": "1","correct": "40" }]}

function getQuesionID(id) {
    // get the next question greater than or equal to id
    // this works because Math is sorted
    return qs.Math.find(q => q.id >= id)
}
qs.Math.sort((a,b) => a.id - b.id)

console.log(getQuesionID(3))

现在您只需要跟踪您所处的问题，并要求1 +该ID。

带输入值的JSON对象的索引

1 个答案: