返回 $.each 函数之外的每个变量

return each variable outside $.each function

本文关键字：变量 each 函数 返回      更新时间：2023-09-26

我对 JSON 中的多维数组有点陌生，我已经用一些东西敲打了一段时间了。让我在下面发布我的代码

杰森：

{
    "easy_questions": [
        {
            "q": "Question 1",
            "a": [
                {"option":"Answer 1",   "correct": false},
                {"option":"Answer 2",   "correct":true},
                {"option":"Answer 3",   "correct":false},
                {"option":"Answer 4", "correct": false}
            ],
            "image": false,
            "source": "dsa"
        }, 
        {
            "q": "Question 2",
            "a": [
                {"option":"Answer 1",   "correct": false},
                {"option":"Answer 2",   "correct":true},
                {"option":"Answer 3",   "correct":false},
                {"option":"Answer 4", "correct": false}
            ],
            "image": false,
            "source": false
        }, // this goes on for about 7 more questions...
    ], 
    "step2_easy": [
        {
            "q": "Question 1",
            "a": [
                {"option":"Answer 1",   "correct": false},
                {"option":"Answer 2",   "correct":true},
                {"option":"Answer 3",   "correct":false},
                {"option":"Answer 4", "correct": false}
            ],
            "image": false,
            "source": false
        },
        {
            "q": "Question 2",
            "a": [
                {"option":"Answer 1",   "correct": false},
                {"option":"Answer 2",   "correct":true},
                {"option":"Answer 3",   "correct":false},
                {"option":"Answer 4", "correct": false}
            ],
            "image": false,
            "source": false
        }, //goes on again

还有我的JavaScript

function quizFun() {
    var questions = [];
    var answers = [];
    var quiz = "url.to/questions.json";
    $.getJSON(quiz, function(data) {
        lvl_1(data);
        function lvl_1(data) {
            var easy = data.easy_questions;
            function shuffle(array) {
                var counter = array.length, temp, index;
                    // While there are elements in the array
                    while (counter--) {
                        // Pick a random index
                        index = (Math.random() * counter) | 0;
                        // And swap the last element with it
                        temp = array[counter];
                        array[counter] = array[index];
                        array[index] = temp;
                    }
                    return array;
            }
            var randoms = shuffle(easy.slice(0));
            randoms.length = 3;
            jQuery.each(randoms, function(i, val) {
                var question = val.q,
                    sourse = val.source;
                    img = val.image;
                    answ = val.a;
                    option = null;
                    correct = null;
                $.each(answ,function(option, correct) {
                    option = this.option;
                    correct = this.correct;
                    answers = '<span data-true="'+correct+'">'+option+'</span>';
                    return answers;
                });
                if(!img) {
                    html_strucutre = question + answers;
                } else {
                    html_strucutre = question + '<img src="'+img+'" width="300">' + answers;
                }
                $('body').append(html_strucutre+'<br>');
            });
        }
    });

我知道这不是最好的方法，但我正在尝试通过小步骤解决这个问题。

首先，我需要得到 3 个随机问题"easy_questions"，以及它们相应的答案（真或假）。一旦我经历了其中的 3 个，我将跳到下一个，依此类推。

我

确实设法得到了问题甚至答案，但是每当我试图退出$.each(answ,function(option, correct) {..}时，它每个问题只返回一个答案，而且总是最后一个答案。

这里到底有什么大问题？

jQuery.each与

本机Array.prototype.forEach方法大致相同，这意味着它为集合中的每个事物运行一次给定函数。这个想法是，你用它来治疗副作用，每件事一次。如其他地方所述，您可以使用它每次通过循环将某些内容推送到数组中。

但是，如果您想

从函数中返回一些东西，更干净的方法是改用jQuery.map()。

    var answers = $.map(answ, function(option, correct) {
        option = this.option;
        correct = this.correct;
        answer = '<span data-true="'+correct+'">'+option+'</span>';
        return answer;
    });

这将生成一个与answ长度相同的数组，但包含为每个数组构建的字符串answer。然后，您可以调用.join()将其转换为一个字符串。

var myHtml = answers.join("");

你可以通过使用数组的内置map函数来完全避免jQuery $.map：

    var answers = answ.map(function(option, correct) {
        option = this.option;
        correct = this.correct;
        answer = '<span data-true="'+correct+'">'+option+'</span>';
        return answer;
    });
相关文章：