Search code examples
jquerymobileiframereferenceerror

can't find variable : jQuery only in mobile devices (iPad iPhone, Android...)

I have a strange bug. I am writing a plugin for wordpress, and i include an iframe in posts which embed presentations. I fill this iframe with scripts and slides, and everything is working just fine on computers (chrome firefox safari), but when i load my post with my embedded presentation in a device (iPad Android or iPad), it simply does not work. I have 2 errors in the safari debug console : 

JavaScript: Error undefined ReferenceError: Can't find variable: jQuery

Here is my script filling my iframe : 

                //Include jQuery first !
                var iframe_embed_script_place = document.getElementById('embedded-frame-presentation');

                var script_iframe_embed = iframe_embed_script_place.contentWindow.document.createElement('script');
                script_iframe_embed.type = "text/javascript";
                script_iframe_embed.src = "http://reveal.presentation.dev/wp-includes/js/jquery/jquery.js";
                script_iframe_embed.async = false;
                iframe_embed_script_place.contentWindow.document.head.appendChild(script_iframe_embed);

                //Include CSS
                jQuery('#embedded-frame-presentation').contents().find('head').append("<link rel=\"stylesheet\" href=\"http://reveal.presentation.dev/wp-content/plugins/presentation/lib/reveal/reveal.min.css\" type=\"text/css\">");

I am stuck on this issue, and i do not understand why this is not working on mobile devices !

Thank you for your help

Solution

  • As i see you may not getting the jquery from the url, becasuse of the .dev domain. if possible can you check 404 erros in fiddler. alternative i suggest you to use the CDN to Serve the Jquery library.. with an Fallback to the local path. 

    <script type="text/javascript" src="//ajax.microsoft.com/ajax/jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
    document.write(unescape("%3Cscript src='/js/jquery-1.4.2.min.js' type='text/javascript'%3E%3C/script%3E")); // change the Local path of the Jquery library
}
</script>