2010-01-20 34 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

我跟着鏈接檢查了源代碼,當他說轉發時他的意思是他使用了框架。由於該框架的內容(包括「

相關問題