I want to trigger a click callback js function on "Tweet". My code is:
<a href="https://twitter.com/share" class="twitter-share-button" data-url="https://twitter.com/share" data-via="josephjohnbless">Tweet</a>
<script>
window.twttr = (function (d, s, id) {
var t, js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return; js = d.createElement(s); js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
return window.twttr || (t = { _e: [], ready: function (f) { t._e.push(f) } });
}(document, "script", "twitter-wjs"));
</script>
<script>
twttr.ready(function (twttr) {
twttr.events.bind('click', function (event) { alert('yes'); });
});
</script>
There is a Uncaught TypeError: Cannot read property 'ready' of undefined for twttr.ready(). I saw this to be a valid solution at https://stackoverflow.com/a/24698352/1972266, but, as I said, it is not working for me.
EDIT: I solved my problem this way: 1. I changed this code:
<script>
window.twttr = (function (d, s, id) {
var t, js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return; js = d.createElement(s); js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
return window.twttr || (t = { _e: [], ready: function (f) { t._e.push(f) } });
}(document, "script", "twitter-wjs"));
</script>
with:
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
I was calling this code:
twttr.ready(function (twttr) { twttr.events.bind('click', function (event) { alert('yes'); }); });
on the wrong place in my files. I was calling it on the parent view(my application is ASP.NET MVC) instead in the partial view, where i had my <a href="https://twitter.com/share" class="twitter-share-button" data-url="https://twitter.com/share" data-via="josephjohnbless">Tweet</a> and <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>. And that was it.
