2012-06-12 2 views
12

Đấu tranh để tải json từ tệp (myData.json) trên URL vào một đối tượng để tôi có thể truy cập các giá trị thuộc tính.tải json từ tệp vào đối tượng

- Dữ liệu tải ngay lập tức, tôi cần rất nhiều dữ liệu trong ứng dụng.

- Tôi sẽ truy cập dữ liệu trong suốt ứng dụng, không chỉ là một phần của một chức năng xảy ra ngay sau khi tải dữ liệu.

- Tôi đã đảm bảo dữ liệu trong tệp của tôi được định dạng đúng json.

Tiếp theo ví dụ trên API jquery, nên tôi không thể làm điều gì đó đơn giản như:

alert (jqxhr.myProperty);

và nhận giá trị? Bước nào tôi bị thiếu ở đây? Tôi đã thử chạy eval và nhiều thứ khác nhau như

var myObj = JSON.parse (jqxhr);

không có kết quả.

Xin vui lòng .... cảm ơn bạn.

// Assign handlers immediately after making the request, 
// and remember the jqxhr object for this request 
var jqxhr = $.getJSON("example.json", function() { 
    alert("success"); 
}) 
.success(function() { alert("second success"); }) 
.error(function() { alert("error"); }) 
.complete(function() { alert("complete"); }); 

// perform other work here ... 

// Set another completion function for the request above 
jqxhr.complete(function(){ alert("second complete"); }); 

Trả lời

12

Tôi nghĩ rằng bạn đang làm nó quá phức tạp :)

var JSON; 

$.getJSON('example.json', function(response){ 
     JSON = response; 
     alert(JSON.property); 
}) 
//feel free to use chained handlers, or even make custom events out of them! 
.success(function() { alert("second success"); }) 
.error(function() { alert("error"); }) 
.complete(function() { alert("complete"); }); 

chức năng getJSON tự động chuyển đổi phản ứng của bạn thành một đối tượng JSON thích hợp. Không cần phải phân tích cú pháp.

Bạn đã đề cập rằng bạn đang sử dụng dữ liệu này ở khắp nơi, vì vậy bạn sẽ phải chờ cuộc gọi ajax hoàn tất trước khi dữ liệu bị xâm phạm. Điều đó có nghĩa là gói toàn bộ ứng dụng của bạn trong cuộc gọi lại getJSON. Hoặc sử dụng một sự kiện tùy chỉnh để xác định như sau:

var JSON; 

$(window).on('JSONready', function(){ 
     alert(JSON.property); 
}); 

$.getJSON('example.json', function(response){ 
     JSON = response; 
     $(window).trigger('JSONready'); 
}); 

$('#elem').on('click', function(){ 
     //event likely to take place after ajax call has transpired 
     //it would still be better to assign this listener in a callback, 
     //but you can get away with not doing it, if you put in a catch 
     if(JSON){ 
      alert(JSON.property); 
     }   
}); 

EDIT

Sau một debug sống nhanh, lý do thực sự cho các dữ liệu là không có sẵn là thế này: javascript mà tiêu thụ JSON được nằm trong một file bao gồm tài liệu trang NORTH của javascript nội tuyến thực hiện cuộc gọi. Kết quả là JSON không phải là một biến toàn cầu và phạm vi ngăn cản việc sử dụng nó. Nếu bạn thực sự cần một biến là toàn cầu để nó có thể được sử dụng với inline JS cũng như bất kỳ và tất cả bao gồm các file js, bạn có thể làm như vậy như thế này:

(function(){ 
     var limitedScopeVariable = 25; 
     window.globalScopeVariable = 30; 
    })(); 

    $(function(){ 
     alert(globalScopeVariable); //works! 
     alert(limitedScopeVariable); //fails! 
    }); 

EDIT 2

Kể từ jQuery 3.0, các chức năng gọi lại khác nhau: Các phương thức gọi lại jqXHR.success(), jqXHR.error() và jqXHR.complete() gọi là được xóa khỏi jQuery 3.0. Bạn có thể sử dụng jqXHR.done(), jqXHR.fail(), và jqXHR.always() thay vì

từ các ý kiến ​​@ Mario-lurig

+0

Điều đó sẽ không hoạt động. 'alert (JSON.property);' được thực hiện trước khi gọi lại được gọi. –

+0

ah bạn là chính xác – Fresheyeball

+0

và id như xử lý lỗi và các tính năng thành công. tại sao tôi sử dụng ví dụ. –

3

dữ liệu json được truyền cho hàm callback của $ .getJSON. Vì vậy, đây sẽ làm việc:

var jqxhr; 

$.getJSON("example.json", function(data) { 
    jqxhr = data; 
}); 

// alert(jqxhr.property); 
// caution: this won't work immediately on load, since the ajax call runs asynchronously and hasn't finished at that time 

// it should be available at a later time, like a click event 
$('a#something').click(function(){ 
    if(jqxhr){ 
      alert(jqxhr.property); 
    }else{ 
      alert('getJSON not yet complete or failed'); 
    } 
}); 
+1

+1 để cảnh báo. –

+0

im tải dữ liệu trong cuộc gọi jquery xảy ra trước document.onLoad(); cháy, do đó, dự đoán nó sẽ có sẵn. nút bắt đầu không được hiển thị cho đến khi onLoad(); –

+1

@ Feshesheball vì vậy có gì sai khi chỉ ra một cạm bẫy có thể xảy ra và đề xuất giải pháp một dòng dưới đây? – Andy

0

Tôi nghĩ rằng đây sẽ là những gì bạn đang tìm kiếm, bạn đang cố gắng truy cập vào dữ liệu trả về từ cuộc gọi của bạn không phải là đối tượng gọi chính nó. Trong ví dụ của bạn, jqxhr là đối tượng xử lý cuộc gọi JSON không phải là dữ liệu. Vì vậy,

Ví dụ đầu tiên trên this page tương tự như những gì tôi đã giải thích.