Javascript，无法读取未定义的属性，但打印到控制台

Question

我有一个jQuery调用，它正在将数据输入到一个对象中。我正在尝试使用对象值设置为来自 的标签文本javascript，但它抛出“无法读取未定义的属性‘0’。”当它成功地将值打印到控制台时。var questionData;var optionData;$(document).ready(function () {        $.ajax({        url: 'coaching-assessment-tool.aspx/GetCATQuestionAndOptions',        type: 'POST',        dataType: 'json',        contentType: "application/json; charset=utf-8",        success: function (data) {                        questionData = data.d[0];            optionData = data.d[1];                       console.log(questionData[0].QuestionText);            console.log("Question Data", questionData);            console.log("Option Data", optionData);        },        error: function (error) {            console.log(error);            alert('Error retrieving data. Please contact support.');        }            });    document.getElementById('firstQuestion').innerHTML = questionData[0].QuestionText;});我需要标签文本作为对象值 (questionData[0].QuestionText)。

Answer 1

$.ajax() 默认情况下是异步的，因此innerHTML在questionData填充之前进行设置。在成功回调中移动第 22 行以确保数据在使用前可用。

虽然在技术上可以使调用同步，但这是一个坏主意。

$.ajax({   // ...
   async: false,   // ...});

该代码将阻止任何其他 JavaScript 执行，直到 ajax 调用完成。

顺便说一句，像TypeScript这样的 JavaScript 工具可以帮助您在代码在浏览器中执行之前发现这些错误。我最近将一些 JS 转换为 TS 并且对我捕获的错误数量感到非常满意。