2010-01-20 99 views
0

我转发的域http://whatthecatdragged.in/所有Ajax内容加载(隐形),以http://moppy.co.uk/wtcdi/没有一个域

根页面(index.html的)使用Ajax加载内容。在原始主机(moppy.co.uk/wtcdi)页面和所有内容加载。但是,在域转发域(whatthecatdragged.in)中,某些内容不会加载。请问.each用于触发阿贾克斯呼叫,如AnthonyWJones所述?

我已经尝试调试这一点,但在Firefox 3.5中Firebug控制台上独有的转折点实际上似乎让所有的内容加载。

 // Content building code: 
     $(function(){ 
      // Set a few variables (no need for secrecy with Flickr API key). 
      var apiKey = 'myapikey'; 
      // var tags = ''; 
      var tagsArr = new Array(); 
      // Get the photos of flickr user WhatTheCatDraggedIn. 
      // This Ajax call always seems to complete. 
      $.getJSON('http://api.flickr.com/services/rest/?&method=flickr.people.getPublicPhotos&api_key=' + 
        apiKey + 
        '&[email protected]&extras=date_taken,tags&format=json&jsoncallback=?', 
        function(data){ 

       // Set some variables to ensure alldata is fecthed from second API 
       // call (below) before building majority of content. 
       var totalExpected = data.photos.total; 
       var totalFetched = 0; 
       var photohtml = ''; 

       // For each photo, do the following: 
       $.each(data.photos.photo, function(i, item) { 
        // Set size of photo thumbnail to display. 
        var size = 's'; 
        var append = ''; 
        if (i == 0) { 
         // Display most recent thumbnail larger, and add a line 
         // break for small pics beneath it. 
         size = 'm'; 
         append = '<br />' 
        } 
        //Only display thmbnails of 4 most recent catches (1 large, 3 small). 
        if (i <= 3) { 
         var photoSrc = 
          'http://farm' + item.farm + '.static.flickr.com/' + 
          item.server + '/' + item.id + '_' + item.secret + '_' + 
          size + '.jpg' 
         //Each thumbnail links to that photo's Flickr page. 
         var flickrPage = 
          'http://flickr.com/photos/' + item.owner + 
          '/' + item.id + '/'; 
         // Each thumbnail has a big tooltip, with tags formatted appropriately. 
         var formattedTags = item.tags.replace(/\s/g, "<br />"); 
         formattedTags = formattedTags.replace(/cat/, "cat: "); 
         formattedTags = formattedTags.replace(/loc/, "location: "); 
         formattedTags = formattedTags.replace(/victim/, "victim: "); 
         formattedTags = formattedTags.replace(/status/, "status: "); 
         formattedTags = formattedTags.replace(/floor/, " floor"); 
         formattedTags = formattedTags.replace(/toy/, " toy"); 
         //Append the built html to one varable for adding to page shortly 
         photohtml += 
          '<a class="flickr-page-link" href="' + 
          flickrPage + '"><img src = "' + 
          photoSrc + '" title="' + formattedTags + '"/>' + 
          append + '</a>'; 
        } 

        var photoID = item.id; 
        // Get the detailed photo information (including tags) for the photo. 
        // This is the call that perhaps fails or at least content 
        // generated after this call does not load. 
        $.getJSON(
          'http://api.flickr.com/services/rest/?&method=flickr.photos.getInfo&api_key=' + 
          apiKey + '&photo_id=' + photoID + 
          '&format=json&jsoncallback=?', function(data){ 
         if (data.photo.tags.tag != '') { 
          $.each(data.photo.tags.tag, function(j, item) { 
           // Place all tags in an aray for easier handling. 
           tagsArr.push(item.raw); 
          }); 
          // Incrememt number of photos fetched. 
          totalFetched += 1; 
          // Have we got them all? 
          if (totalFetched == totalExpected) 
           fetchComplete(); 
         } 
        }); 
        // Builds a shedload more content once all JSON calls are completed. 
        function fetchComplete() 
        { 
         // ### BUILD VICTIM list ### 
         // format a regex to match tags beginnign : "victim: " 
         var vicRe = /^v[a-z]+:\s([a-z\s]+)/ 
         // Match the regex to the tags and count number of matches per tag. 
         var vicCounts = tagsArr.countVals(vicRe); 
         var victimsHtml = ""; 

         // For each victim. 
         for (var i in vicCounts) { 
          var strippedTag = [i].toString().replace(/\W/g, ""); 
          console.debug(strippedTag); 
          // Add a line of html with the type of victim and the number of victims of that type 
          victimsHtml += 
           "<a href='http://flickr.com/photos/[email protected]/tags/victim" + 
           strippedTag +"/'>" + [i] + 
           " (" + vicCounts[i] + ") </a><br />"; 
         }; 
         // Replace existing HTML with new version. 
         $('#types-dragged').html(victimsHtml); 

         // ### BUILD STATUS PIE CHART ### 
         // Build a theme for chart colours. 
         var wtcdicharttheme= { 
          colors: ['#C66800', '#D3C70B', '#DD3D0B', '#D30729', 
            '#DDA70B'], 
          marker_color: '#000000', 
          font_color: '#000000', 
          background_colors: ['#ffffff', '#ffffff'] 
         }; 

         // Create a new chart object, include css id of canvas 
         // where chart will be drawn. 
         var g = new Bluff.Pie('status', '275x250'); 
         // Set a theme and stuff. 
         g.set_theme(wtcdicharttheme); 
         // No title, as this exists via the raw page HTML. 
         g.title = ''; 
         g.legend_font_size = "50px"; 
         g.marker_font_size = "20px"; 

         // Build a regex string to match tags beginning "status: ". 
         var statRe = /^s[a-z]+:\s([a-z\s]+)/ 
         // Match regex to tags and return an object with tag 
         // names and number of occurences. 
         var statCounts = tagsArr.countVals(statRe); 

         // For each status. 
         for (var i in statCounts) { 
          // Add data to the chart 
          g.data([i], [statCounts[i]]); 
         }; 
         // Draw the chart. 
         g.draw(); 

         // ### BUILD LOCATION LIST ### 
         // Build a regex that matches tags beginning "loc: " 
         var locRe = /^l[a-z]+:\s([a-z\s]+)/ 
         // Match regex to tags and return an object with 
         // tag names and number of occurences. 
         var locCounts = tagsArr.countVals(locRe); 
         var locatHtml = ""; 

         // For each location. 
         for (var i in locCounts) { 
          var strippedTag = [i].toString().replace(/\W/g, ""); 
          // Add a line of html with the location and the 
          //number of times victims found in that location. 
          locatHtml += 
           "<a href='http://flickr.com/photos/[email protected]/tags/loc" + 
           strippedTag +"/'>" + [i] + " (" + 
           locCounts[i] + ") <br />"; 
         }; 
         // Replace existing html with newly built information. 
         $('#locations').html(locatHtml); 

         // ### BUILD CAT LIST ### 
         // Build a regex that maches tags beginning "cat: ". 
         var catRe = /^c[a-z]+:\s([a-z_\s]+)/ 
         //Match regex to find number of catches each cat has made 
         var catCounts = tagsArr.countVals(catRe); 

         // For each cat. 
         for (var i in catCounts) { 
          var strippedTag = [i].toString().replace(/\W/g, ""); 
          // Insert number of catches to div titled "(catname)-catch" 
          $('#'+ [i] + '-catch').html(
           "<a href='http://flickr.com/photos/[email protected]/tags/" + 
           strippedTag + "/'>" + catCounts[i] + "</a>"); 
         }; 
        } 
       }); 
       // Insert total dragged onto page. 
       $('#total-dragged').html(data.photos.total); 
       // Insert photos onto page. 
       $('#latest-catches').html(photohtml); 
       // Add tooltips to the images from Flickr. 
       $('img').each(function() { 
        $(this).qtip({ 
         style: { 
          name: 'wtcdin' 
         }, 
         position: { 
          target: 'mouse', 
          adjust: { 
           x: 8, 
           y: 10 
          } 
         } 
        }) 
       }); 
      }); 
     }); 

更新1:我的域名公司联系,他们的意见基本上是“不使用JavaScript”。仍然不明白为什么它会在一个域名下工作,而不是另一个域名下工作......难道这是因为他们通过框架“转发”了域名吗?

+0

我跟着这两个环节,“在拖动项的类型”,“发现地点的项目”和“项目状态”在任何情况下不加载... – 2010-01-20 20:09:27

+0

是的,看来我以前有,在同一会话中当我在moppy.co.uk上查看版本时,在标签上启用了萤火虫。我的错。 – fearoffours 2010-01-20 22:38:52

回答

2

浏览器会封锁所有脚本托管在域的外部发送Ajax请求。这很可能是事情发生的问题的原因。

编辑:我发现这个问题,你有console.debug()调用你的脚本。这个方法是由Firebug控制台定义的,这就是为什么它只在控制台处于活动状态时才起作用。尝试删除对console.debug()的任何调用并查看它是如何发生的。

+0

我跟着链接检查了源代码,当他说转发时他的意思是他使用了框架。由于该框架的内容(包括“

相关问题