The “document.ready()” function not firing on Chro

Question

I have jQuery-2.1.4.min.js called before the tag, but when I write something like:

<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function() {
        alert('hi, world.');
    });
</script>

On my PC it is fired of course, but on ten different Android devices it just does not. This is purely HTML/CSS/jQuery rendered site (no phonegap, or anything).

My goal was to have a button do ajax request after it's being tapped, but I can't even test that, because the .ready() function is not firing at all on mobile chrome.

The jQuery is being served from the official CDN, any help would be very much appreciated.

Tried both:

$(function() {
   alert('hi, world.');
});

And

jQuery(document).ready(function() {
    alert('hi, world.');
});

Same thing.

As suggested I also tried:

window.onload = function()
{
    if (window.jQuery)
    {
        alert('jQuery is loaded');
    }
    else
    {
        alert('jQuery is not loaded');
    }
}

And it alerts 'jQuery is loaded'.

As per jQuery docs it says: "Code included inside $( document ).ready() will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute" - which would mean that DOM is not ready for JavaScript code to execute? But when I try like:

<script type="text/javascript">
    alert('hi world');
</script>

It executes on mobile Chrome.

Answer 1

JS breaks on mobile view becouse same js use multiple time in file. Check and remove redundancy.

Answer 2

Okay, after extensive investigation it seems that JS breaks on mobile chrome if you have document.ready() function twice, I had one in my core.js file and one in-line on the page.

It works okay on PC (all browsers), but on mobile it works up to the point of second ready() call and breaks all JS after that.

Hopefully this saves some time to others in the future.