.load調用'facebook like box'正在破解jquery

當我試圖用Ajax調用「facebook like box」時，我看到一些奇怪的行爲。.load調用'facebook like box'正在破解jquery

這個想法是用戶點擊一個按鈕。 Onclick，facebook插件將被調用並出現。再次，Onclick，內容將消失。

這樣做的原因是在頁面加載時減少HTTP請求。這是實現這種目標的最佳方式嗎？

我寫的代碼與另一個調用天氣頁面的函數完美結合。所以即時通訊認爲這可能是與Facebook插件打破jQuery /功能？

這是我的JS小提琴的代碼; http://jsfiddle.net/aynzA/2/

你可以看到代碼我的網站在頁腳「全天候」工作，r.adamtoms.co.uk

<style>.loader{background-color:red;margin: 30px 0;}</style> 
    <ul>  
     <li class="facebook-f"> 
      <div class="footer-text"> 
       <a href="#" onclick="return false;">Facebook</a> 
      </div> 
      <div class="fb-loader-content"><br>loading wheel</div> 
     </li> 
    </ul> 
    <div class="facebook-content" style="display: none;"></div> 

    $(".facebook-f").click(function() { 
     if (!$(".facebook-content").is(':visible')) { 
      $('.fb-loader-content').addClass('loader'); 
      alert('class added') 
      $('.facebook-content').load("http://www.google.com", function() { 
      alert('loaded google, now remove loading wheel') 
       $('.fb-loader-content').removeClass('loader'); 
      }); 
      $('.facebook-content').toggle(); 
     } else { 
      $('.facebook-content').toggle(); 
     } 
    });

真的很感謝這方面的一些反饋。請原諒我的天真，我是新手。

來源

2014-02-21 atoms

我在另一頁上找到了一個有類似問題的人。建議他們添加FB.XFBML.parse（）; .load（）之後。我已經試過這現在使它掛在裝載機上。 – atoms

使用@LowerClassOverflowian計數器方法和一個「閉包」我設法做出一些工作。

下面是代碼：

var element = document.getElementById("facebook-f"); 

element.onclick = (function() { "use strict"; 

// init the count to 0 
var count = 0; 

return function(e) { 
    //count 
    count++; 

if (count === 1) { // do something on first click 
    $('.fb-loader-content').addClass('loader'); 
    $('.facebook-content').load("templates/include/scripts/facebook.php", function() { 
     $('.fb-loader-content').removeClass('loader'); 
    }); 
} 
if (count > 1) { 
    $('.facebook-content').slideToggle(200); 
} 
}; 

})();

歡呼大家的幫助。如果您有任何進一步的建議，請讓我知道。

來源

2014-03-03 20:09:31 atoms

如果你看一下在您的瀏覽器的控制檯你的網站，你會看到以下錯誤：

Uncaught SyntaxError: Unexpected identifier (index):62 
Uncaught ReferenceError: FB is not defined core.js:66 
Invalid App Id: Must be a number or numeric string representing the application id. all.js:56 
FB.getLoginStatus() called before calling FB.init(). all.js:56

我猜測，「應用ID無效」有事情做與它不工作的原因。

來源

2014-02-21 08:58:18

謝謝傑克的迴應。即時顯示，因爲我添加了'FB.XFBML.parse（）;'之後.load（）如在這裏建議：stackoverflow.com/questions/6345787/jquery-load-will-break-facebook-like-button-comment-box-how-to-workaround 任何想法如何把這個對？ – atoms

好吧，所以我找到了解決辦法。我將：visible改爲：hidden並刪除了style =「display：none;」來自facebook-content div。似乎已經完成了這項工作。

<ul>  
    <li class="facebook-f"> 
     <div class="footer-text"> 
      <a href="#" onclick="return false;"></a> 
     </div> 
     <div class="fb-loader-content"></div> 
    </li> 
</ul> 
<div class="facebook-content"></div> 

$(".facebook-f").click(function() { 
    if (!$(".facebook-content").is(':hidden')) { 
     $('.fb-loader-content').addClass('loader'); 
     alert('class added') 
     $('.facebook-content').load("http://www.google.com", function() { 
     alert('loaded google, now remove loading wheel') 
      $('.fb-loader-content').removeClass('loader'); 
     }); 
     $('.facebook-content').toggle(); 
    } else { 
     $('.facebook-content').toggle(); 
    } 
});

來源

2014-02-21 12:26:37 atoms

.load調用'facebook like box'正在破解jquery

回答

相關問題