关于jquery:Javascript函数命令AJAX

Javascript function order AJAX

本问题已经有最佳答案,请猛点这里访问。

我的问题是pointonmap()在xmlpreparer()之前运行,尽管按顺序运行。我认为这与使用Ajax有关。ParseXML创建了我需要的对象。所以当我使用pointonmap()时,它已经被初始化了。

在第页,我首先从pointonmap-0看到,然后从parse.看到,所以顺序不对。谢谢你的建议。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
var mesta= new Array();


function init() {
    xmlPreparer();
    pointOnMap();  
}

//add source
function xmlPreparer() {  
    $.ajax({
    type:"GET",
    url:"./mesta.xml",
    dataType:"xml",
    success: parseXml
  });
}

function parseXml(xml) {

    var type;
    var name;
    var latitude;
    var longitude;

  $(xml).find("city").each(function()
  {
    type=$(this).find("type").text();
    name=$(this).find("name").text();
    latitude= $(this).find("latitude").text();
    longitude=$(this).find("longitude").text();
    var mesto = {type:type, name:name, latitude:latitude, longtitude:longitude};
    mesta.push(mesto);
  });
    alert(mesta.length);//this prints right size
}

//add source
function pointOnMap() {
alert(mesta.length);//for no reason prints 0 and runs before xmlparser?
$('#dot').css('top', YLatToPixel(0,$('#jpMapa')))
$('#dot').css('left', XLngToPixel(0,$('#jpMapa'))+'px');
}

function YLatToPixel(lat,elem){
var containerHeight=$(elem).height();
lat+=90;
var calculatedHeight=((lat*containerHeight)/180);
return $(elem).offset().top+($(elem).height()-calculatedHeight);
}


function XLngToPixel(lng,elem){
var containerWidth=($(elem).width());
lng=lng+180;
return $(elem).offset().left+((lng*containerWidth)/360);
}


用jquery这样的承诺重新编写它:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function init() {
    xmlPreparer().then(function(data){
        parseXml(data);
        pointOnMap();  
    });
}

//add source - returns the Ajax promise
function xmlPreparer() {  
   return $.ajax({
    type:"GET",
    url:"./mesta.xml",
    dataType:"xml"
  });
}

注:thendone的区别在于then允许传递第二个fail函数。done与ajax中的success:类似,具有匹配的fail()函数,因此您也可以编写。

1
2
3
4
5
6
7
8
function init() {
    xmlPreparer().done(function(data){
        parseXml(data);
        pointOnMap();  
    }).fail(function(){
        alert("arggh!");
    });
}