为什么我收到此错误:“未捕获的TypeError:无法读取未定义的属性'标题'”?

时间:2011-11-13 19:18:53

标签: javascript jquery ajax json

我正在尝试编写 ajax 网络应用。我有一个函数,假设要求 json 对象,然后用它来重新/填充网站。

以下是问题中的 Javascript (第8 - 16行)

window.onload=LoadData("Home", {});
var _doc = {};
function LoadData(page, params) {
    $.get(page, params, function ( data ) { 
        _doc = jQuery.parseJSON( data ); 
        }
    );
    document.title = _doc.Title.Title;
};

以下是错误 Chrome

Uncaught TypeError: Cannot read property 'Title' of undefined
LoadDatahttp://127.0.0.1/:15
(anonymous function)

如果我在控制台中运行相同的语句,这就让我感到困惑:

document.title = _doc.Title.Title;
"Home"

它将标题更改为Home

以下是未明确的证据:

_doc
Object
   Body: Object
      Menus: Array[4]
         0: Object
            Menu: Object
         1: Object
            Menu: Object
         2: Object
            Menu: Object
         3: Object
            Menu: Object
   Title: Object
      Title: "Home"
   User: Object
      Name: "Username"

和截图概述: This is What the Chrome Console Looks Like... 注意:对底部函数的调用确实改变了标题

2 个答案:

答案 0 :(得分:6)

您只能在回调中访问AJAX请求中的data

window.onload=LoadData("Home", {});
var _doc = {};
function LoadData(page, params) {
    $.get(page, params, function ( data ) { 
          _doc = jQuery.parseJSON( data ); 
          document.title = _doc.Title.Title;
        }
    ));
};

AJAX请求(异步 JavaScript和XML)请求是异步的;浏览器启动请求,等待响应...而是继续执行JavaScript。 稍后,当AJAX请求的HTTP请求完成后,将调用您为AJAX请求提供的回调,并且可以访问HTTP响应中包含的数据。

在您的情况下,在调度AJAX请求之后(即在上面提到的稍后之前),document.title = _doc.Title.Title;会立即执行 ;所以回调_doc = jQuery.parseJSON( data );尚未触发,因此_doc仍然是一个空对象,因此_doc.Title未定义,并尝试在未定义的{{1}上检索Title抛出错误。

与您的问题无关,但仅供参考,您可能需要查看jQuery.getJSON方法; _doc.Title方法与您传递的响应对象之间的区别已经是JSON对象(因此您不需要调用jQuery.get

答案 1 :(得分:1)

您的$.get()函数是异步的。这意味着当你调用它时,你所做的就是开始执行ajax调用。因此,它后面的一行:

document.title = _doc.Title.Title;

在ajax调用完成之前执行。你只知道ajax调用已完成它的完成功能。

要解决此问题,请在{ajax完成函数:

中引用_doc
window.onload=LoadData("Home", {});
var _doc = {};
function LoadData(page, params) {
    $.get(page, params, function ( data ) { 
        _doc = jQuery.parseJSON( data ); 
        document.title = _doc.Title.Title;
        }
    );
};