On an HTML page, how can I find out when a specific external javascript object is defined and ready to call methods on it?
Features of the problem:
I am using a uservoice web feedback application, including their javascript widget and their SSO (Single-SignOn).
Everything works perfectly. In the left part of the window is a noticeable tab "Feedback". And I can use the following anchor for sitelinks to open my backtip widget:
<a href="#" onclick="UserVoice.Popin.show(uservoiceOptions); return false;">feedback</a>
But ... I had problems with supporting an additional workflow - on one page (for example, on the feedback page). I want the uservoice feedback form to pop up automatically when the user navigates to the page without being clicked.
I tried putting the following at the bottom of the page:
<script type="text/javascript">
function _autoPopupUserVoice() {
UserVoice.Popin.show(uservoiceOptions);
}
_loadSuper = window.onload;
window.onload = (typeof window.onload != 'function') ? _autoPopupUserVoice : function() { _loadSuper(); _autoPopupUserVoice(); };
</script>
But Firebug shows the error " UserVoice not defined". Therefore, I assume that the uservoice JavaScript code was not executed by the time it is called _autoPopupUserVoice().
I tried a few other things, but I was not able to get it to work. How to know when a javascript object is Uservoiceloaded and ready to call methods on it?
For reference, the Uservoice object is loaded through the following javascript at the end of the page:
<script type="text/javascript">
function _loadUserVoice() {
var s = document.createElement('script');
s.setAttribute('type', 'text/javascript');
s.setAttribute('src', ("https:" == document.location.protocol ? "https://" : "http://") + "cdn.uservoice.com/javascripts/widgets/tab.js");
document.getElementsByTagName('head')[0].appendChild(s);
}
_loadSuper = window.onload;
window.onload = (typeof window.onload != 'function') ? _loadUserVoice : function() { _loadSuper(); _loadUserVoice(); };