Tham chiếuLỗi: "twttr không được xác định" ngay cả khi sử dụng twttr.ready()

Question

Giao diện điều khiển Firebug sẽ phát ra lỗi. Nó nói rằng mã mà tôi đang cố gắng sử dụng để theo dõi các sự kiện xã hội được sử dụng trước khi //platform.twitter.com/widgets.js tải xong không đồng bộ.

ReferenceError: twttr is not defined twttr.ready(function (twttr) {

Tuy nhiên, tôi theo Twitter tài liệu (https://dev.twitter.com/web/javascript/events), và quấn nó xung quanh twttr.ready(), trong cùng một cách một trong những hiện với các sự kiện Facebook.

<script type="text/javascript"> //load social sharing buttons async 
    (function(w, d, s) { 
     function go(){ 
     var js, fjs = d.getElementsByTagName(s)[0], load = function(url, id) { 
      if (d.getElementById(id)) {return;} 
      js = d.createElement(s); js.src = url; js.id = id; 
      fjs.parentNode.insertBefore(js, fjs); 
     }; 
     load('//connect.facebook.net/en_US/all.js#appId=1111111111111111&xfbml=1', 'fbjssdk'); 
     load('https://apis.google.com/js/plusone.js', 'gplus1js'); 
     load('//platform.twitter.com/widgets.js', 'tweetjs'); 
     } 
     if (w.addEventListener) { w.addEventListener("load", go, false); } 
     else if (w.attachEvent) { w.attachEvent("onload",go); } 
    }(window, document, 'script')); 
</script> 

<script type="text/javascript"> 
     window.fbAsyncInit = function() { 
       FB.Event.subscribe('edge.create', function(targetUrl) { 
       ga('send', 'social', 'facebook', 'like', targetUrl); 
      }); 
       FB.Event.subscribe('edge.remove', function(targetUrl) { 
       ga('send', 'social', 'facebook', 'unlike', targetUrl); 
      }); 
     } 
     twttr.ready(function (twttr) { 
     twttr.events.bind('tweet', function(e){ 
      if(!e) return; 
      ga('send', 'social', 'twitter', 'tweet', theURL); 
     }) 
     }); 
    </script> 

Bất kỳ gợi ý nào?

Answer 1

Dường như twttr chưa được khởi tạo. Đảm bảo rằng tập lệnh (//platform.twitter.com/widgets.js) đang tải trước khối mã bạn có.

Đây là lý do bạn nhận được không xác định (twttr).

Sau khi xem các chỉnh sửa của bạn, điều này rõ ràng là điều gì đang xảy ra. Các tập lệnh của bạn đang thêm đầu và tải tập lệnh sau khi tải trang. Ngay sau khi bạn đang thực thi mã phụ thuộc vào những thứ bạn đã tiêm vào đầu và vẫn đang tải đó là lý do tại sao twttr chưa được khởi tạo.

Hãy thử khối mã này dưới đây:

window.addEventListener("load", function() { 
    window.fbAsyncInit = function() { 
     FB.Event.subscribe('edge.create', function(targetUrl) { 
      ga('send', 'social', 'facebook', 'like', targetUrl); 
     }); 
     FB.Event.subscribe('edge.remove', function(targetUrl) { 
      ga('send', 'social', 'facebook', 'unlike', targetUrl); 
     }); 
    } 

    document.getElementById('tweetjs').addEventListener('load', function() { 
     twttr.ready(function (twttr) { 
      twttr.events.bind('tweet', function(e){ 
       if(!e) return; 
       ga('send', 'social', 'twitter', 'tweet', theURL); 
      }) 
     }); 
    }, false); 
}, false); 

Nếu bạn muốn hỗ trợ trình duyệt chéo, bạn có thể muốn làm theo những gì họ đã làm trong chức năng của họ để kiểm tra window.addEventListener đầu tiên, và sau đó quay trở lại cửa sổ. attachEvent cho các trình duyệt cũ hơn.

Answer 2

Đối với những người gặp sự cố của 'twttr là undefined', sau đây giải quyết nó cho tôi ...

Bao gồm kịch bản này sau khi mở cơ thể và chắc chắn rằng bạn tháo widget.js kịch bản từ nhúng nút của bạn nếu được sao chép & dán trên.

window.twttr = (function(d, s, id) { 
 
var js, fjs = d.getElementsByTagName(s)[0], 
 
t = window.twttr || {}; 
 
if (d.getElementById(id)) return t; 
 
js = d.createElement(s); 
 
js.id = id; 
 
js.src = "https://platform.twitter.com/widgets.js"; 
 
fjs.parentNode.insertBefore(js, fjs); 
 

 
t._e = []; 
 
t.ready = function(f) { 
 
t._e.push(f); 
 
}; 
 

 
return t; 
 
}(document, "script", "twitter-wjs"));