Javascript问题中的变量范围

Question

var query1 = urlencode($('input[name="searchTerm1"]').val()); //user1
var query2 = urlencode($('input[name="searchTerm2"]').val()); //user1
var rpp = 20; //number of tweets to retrieve out
var c=0;
var f1=new Array();
var f2=new Array();
var common=new Array();
$.getJSON('http://twitter.com/followers/ids.json?screen_name='+ query1 + '&callback=?', 
        function(data) {
                                 f1=data;

            $('#content').append('p'+f1[0]+'p');//this one is coming
            });
$.getJSON('http://twitter.com/followers/ids.json?screen_name='+ query2 + '&callback=?', 
        function(data1) {
                                  f2=data1;
                });
$('#content').append('p'+f1[0]+'p');//this one is not coming...its showing Undefined
})

在这段代码中，如果你看得清楚，我已经使用 // 两个附加语句进行了识别

其中一个正在工作并输出数组中的数字

但另一个正在输出未定义

我已经定义了数组，所以它应该取值，但实际上发生的是数组在 $.getJSON 函数之外变得不可访问。

任何帮助将不胜感激。

谢谢

Answer 1

您需要在回调函数中附加您的值。现在，您在两个 $.getJSON 调用之后的代码行在 JSON 完成下载之前触发。这就是第一个附加功能起作用的原因。您有时间问题。

为了说明时间安排，请使用这样的警报消息...

$.getJSON('http://twitter.com/followers/ids.json?screen_name='+ query1 + '&callback=?', function(data) {
    f1=data;
    alert('Two');
    $('#content').append('p'+f1[0]+'p');//this one is coming                
});

$.getJSON('http://twitter.com/followers/ids.json?screen_name='+ query2 + '&callback=?', function(data1) {
    f2=data1;
    alert('Three');
});

alert('One');
$('#content').append('p'+f1[0]+'p');//this one is not coming...its showing Undefined

Answer 2

您从不引用 f2，因此您可能遇到复制/粘贴错误。您的意思是再次引用 f1 吗？

顺便说一下，最好这样初始化数组

var f1=[];
var f2=[];
var common=[];

而不是使用“新数组”。

另外，正如 Josh 所指出的，Ajax 调用是异步的。您不想依赖传入的数据，直到它进来。

您的两个 $getJSON 调用都将立即返回，因此您的程序流程并非您所期望的。

jQuery's $getJSON 将回调函数作为其第三个参数。你想设置一个在通话后做任何处理。

当您使用 Ajax 编程时，您没有一大段 JavaScript，而是一堆事件驱动的代码。

Answer 3

@anand, $.getJSON() 以异步方式检索 JSON 数据。回调函数的目的是在从异步请求接收到 JSON 后执行工作。我会简化你的例子：

var query1 = urlencode($('input[name="searchTerm1"]').val()); //user1
var query2 = urlencode($('input[name="searchTerm2"]').val()); //user1
var rpp = 20; //number of tweets to retrieve out
var c=0;
var f1=new Array();
var f2=new Array();
var common=new Array();

$.getJSON('http://twitter.com/followers/ids.json?screen_name='+ query1 + '&callback=?', 
    // 1st callback
    function(data) {
        f1=data;

        // We know that f1 has been assigned, so unless the Twitter API
        // returns an empty Array, f1[0] will not be Undefined.
        $('#content').append('p'+f1[0]+'p');//this one is coming
});
$.getJSON('http://twitter.com/followers/ids.json?screen_name='+ query2 + '&callback=?', 
    // 2nd callback
    function(data1) {
        f2=data1;
});

// This statement may be executed before 1st callback and therefore
// f1 may still be an empty Array causing f1[0] to return Undefined.
$('#content').append('p'+f1[0]+'p');//this one is not coming...its showing Undefined

请查看有关您调用 append() 的 cmets。希望这会有所帮助！