javascript ReferenceError：即使在使用 twttr.ready() 时，“未定义 twttr”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28550328/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ReferenceError: "twttr is not defined" even while using twttr.ready()
提问by flapane
Firebug console throws an error. It states that the code which I'm trying to use for tracking social events is used before //platform.twitter.com/widgets.js has finished loading asynchronously.
Firebug 控制台引发错误。它指出我试图用于跟踪社交事件的代码在 //platform.twitter.com/widgets.js 完成异步加载之前使用。
ReferenceError: twttr is not defined twttr.ready(function (twttr) {
ReferenceError: twttr 未定义 twttr.ready(function (twttr) {
However, I followed Twitter documentation ( https://dev.twitter.com/web/javascript/events), and wrapped it around twttr.ready(), in the same way one does with Facebook events.
但是，我遵循了 Twitter 文档 ( https://dev.twitter.com/web/javascript/events)，并将其包裹在 twttr.ready() 周围，就像处理 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>
Any hints?
任何提示？
采纳答案by flapane
It appears that twttris not initialized yet. Make sure the script (//platform.twitter.com/widgets.js) is loading before the block of code you have.
似乎twttr还没有初始化。确保脚本 ( //platform.twitter.com/widgets.js) 在您拥有的代码块之前加载。
This is the reason you're getting undefined (twttr).
这就是您未定义 (twttr) 的原因。
After seeing your edits, it's quite clear what is happening. Your scripts are appending the head and loading the scripts after the page is loading. Right after you're executing code that depends on the stuff you've injected into the head and are still loading which is why twttris not initialized yet.
看到您的编辑后，很清楚发生了什么。您的脚本在页面加载后附加头部并加载脚本。在您执行取决于您注入头部的内容并且仍在加载的代码之后，这twttr就是尚未初始化的原因。
Try this code block below:
试试下面的这个代码块：
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);
If you want cross browser support, you may want to follow what they did in their function to check for window.addEventListener first, and then fall back to window.attachEvent for older browsers.
如果您想要跨浏览器支持，您可能需要按照他们在函数中所做的操作来首先检查 window.addEventListener，然后在旧浏览器中回退到 window.attachEvent。
回答by Grant
For those experiencing issues of 'twttr is undefined', the following solved it for me...
对于那些遇到“twttr 未定义”问题的人，以下内容为我解决了...
Include this script after the body opening and make sure you remove the widget.js scripts from your button embedsif copied & pasted over.
在正文打开后包含此脚本，并确保从按钮嵌入中删除 widget.js 脚本（如果复制和粘贴）。
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"));回答by Paramvir Singh Karwal
Well I was having the same issue but I was loading the script in a different way. I was placing the twitter scripttag in the headsection of my index.htmlof my angular app. But it had one problem, it had asyncattribute attached to it. After removing it, the loading of the script was no longer asynchronous but a blocking one, which was the requirement for me.
好吧，我遇到了同样的问题，但我以不同的方式加载脚本。我将 twitterscript标签放在head我index.html的 angular 应用程序的部分。但是它有一个问题，它async附加了属性。去掉之后，脚本的加载不再是异步的，而是阻塞的，这是我的要求。
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
For cases where it is necessary for the script to load before the HTML document parsing happens remove the asynctag.
对于需要在 HTML 文档解析发生之前加载脚本的情况，请移除async标记。
<script src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<script src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
Some help taken from this source: async-vs-defer
来自此来源的一些帮助：async-vs-defer
