在JSON中通過增加值

Question

我在寫一個'性格類型'測驗，並希望爲用戶在測驗中進行選擇時所選擇的選項分配值。這個想法是每個對問題的回答都會有不同的數字權重，我相信隨着某人的進步並最終完成測驗。最後，我會使用理貨提供幾個不同的結果之一。

目前，用戶可以通過測驗進度，但無法獲得數字權重。

這是我在下面的代碼中的方法： - 我使用countValue作爲我的理貨。它在JS的頂部設置爲1。 - 在測驗中的每個問題中，有一個標題爲添加的值被分配了一個數字，就像測驗的初始視圖中增加了一樣：0 - 隨着測驗的進行，還有一個要添加的字段。 - 在測驗的底部是一個標題爲display_scenario的函數，我試圖在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

你應該仔細檢查你的additionInt不遞增countValue（這是什麼的介紹引起的問題）之前不確定的。

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值強制爲一個數字，但您應該以某種方式與您的值保持一致。你現在有第一個作爲一個數字，其餘的字符串。

3）以下的部分，你從codepen複製在這裏，您可以：

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

但是你沒有在你的HTML id的元素。我假定你的意思是#runningTotalHere。