Question

我正在写一个人格类型＆＃39;测验并希望为用户在测验中进行选择时选择的值分配值。这个想法是对问题的每个回答都会有不同的数字权重，我会在有人进展并最终完成测验时记录。最后，我将使用该计数来呈现一些不同的结果。

目前，用户可以通过测验，但我无法获得数字权重。

这是我在下面的代码中的方法： - 我使用countValue作为我的理货。它在我的JS顶部设置为1。 - 在测验中的每个问题中，都有一个标题为添加的值，分配了一个数字，就像测验的初始视图一样：0 - 随着测验的进展，有一个可供添加的字段。 - 在测验的底部是一个名为display_scenario的函数，我在其中尝试将addition的值添加到countValue，但它不起作用。我可以看到它无法正常工作，因为控制台日志为函数中的值提供了NaN值。

所以我似乎没有将加法值转换为整数/数字。我不知道该怎么做。我尝试过使用parseInt（）和Number（）而没有运气。

完整的代码在Codepen上 - http://codepen.io/msummers40/pen/EKJQmN - 但关键的JavaScript / jQuery如下所示。提前感谢您的帮助。

//establishing counter for weighted answer
var countValue = 1;
console.log(countValue);
// var additionInt = 1;
// console.log(additionInt);

// JSON for personality quiz
// Contains the story, paths and variable to weight answers
var story = {
    intro: {
        prompt: 'Welcome message. Let\'s get started.',
        quizImage: '<img id="quizImage" src="https://media.giphy.com/media/vc6gDdl4rHusE/giphy.gif"><br />',
        options: [{
            name: 'get started',
            path: 'get_started',
            addition: 0,
        }]
    },

    get_started: {
        prompt: 'You need pancakes. What kind will you make: thin or fluffy?',
        quizImage: '<img id="quizImage" src="http://www.allgifs.com/wp-content/uploads/2013/09/pancake.gif">',
        options: [{
            name: 'thin',
            path: 'thin',
            addition: '2'
        }, {
            name: 'fluffy (leading to thin temporarily)',
            path: 'thin',
            addition: '3'
        }]
    },

//THIN PANCAKE SECTION
    thin: {
        prompt: 'Yum. What do you do next?',
        quizImage: '<img id="quizImage" src="//media.giphy.com/media/2Mp7y2FkcW80M/giphy.gif">',
        options: [{
            name: 'pop out to get store-bought pancakes',
            path: 'result',
            addition: '2'
        }, {
            name: 'use a recipe',
            path: 'result',
            addition: '1'
        }]
    },

    result: {
        prompt: 'That is all I have for this example!',
        quizImage: '<img id="quizImage" src="http://www.technologytell.com/entertainment/files/2013/11/Leonardo-DiCaprio-Toast-Fireworks-Gif.gif">',
        options: [{
            name: 'Reset',
            path: 'intro' //RESET
        }]
    }
};



/* Chosen option is an object with properties {name, path} */


function display_scenario(chosen_option) {
    var option_name = chosen_option.name;
    var option_path = chosen_option.path;
    var additionInt = chosen_option.addition;
    additionInt = Number(additionInt);
    console.log(additionInt);
    countValue = (additionInt + countValue);
    console.log(countValue);
    var scenario = story[option_path];

Answer 1

在递增countValue之前，你应该仔细检查你的additionInt是否未定义（这是引起问题的原因）。

function display_scenario(chosen_option) {
  var option_name = chosen_option.name;
  var option_path = chosen_option.path;
  var additionInt = chosen_option.addition;

  // Make sure all is well
  if(additionInt){
    countValue += additionInt;
  }

  var scenario = story[option_path];
  ...
  ...
}

作为旁注，您的添加属性已经是一个数字，因此您可以删除该行additionInt = Number(additionInt);

Answer 2

1）正如另一个答案所述，您选择的选项的附加属性开始未定义，因此您可以检查并在一行中为其指定默认值：

// with default value using ||
var additionInt = +chosen_option.addition || 0;

// or with ternary operator
var additionInt = !chosen_option.addition ? 0 : +chosen_option.addition;

然后补充countValue：

countValue += additionInt;

2）上面前几行中的+运算符会将option.addition值强制转换为数字，但您应该以某种方式与addition值保持一致。您当前拥有第一个作为数字和其余字符串。

3）在您从codepen复制的部分下面，您有：

jQuery('<p>').html(countValue).appendTo('#countValueHere');

但是你的html中没有id的元素。我认为你的意思是#runningTotalHere。

增加JSON中的via值

2 个答案: