jQuery not loading when reloading window

Question

I have a strange situation where jQuery is not loading into the window object. My app is an Electron app. My startup page does in fact load jQuery. But while the startup page is loading, I have some code that decides whether to reload the browser window with a different url. That url is another html page in the app and it contains a reference to the jQuery library in the script tag. jQuery does appear to load in this new page because I am able to open DevTools and type $ in the console and it indicates that it is loaded. However, in my javascript code, which is embedded in the page, the $ is not recognized. I am not loading any other scripts that could conflict with the jQuery script. The jQuery script is the only script loaded. What could be preventing jQuery from being attached to the window object? This only happens when I load that new page using window.location.href. If I don't load that page, but simply use jQuery in the startup page, jQuery is attached to the window object.

Here is how I am loading jQuery:

<head>
    <script type="text/javascript" src="../../jquery/jquery-3.2.1.min.js"></script>
</head>

I have tried waiting for jQuery to load using:

function defer(method) {
    if (window.jQuery) {
        method();
    } else {
        setTimeout(function() { defer(method) }, 50);
    }
}

defer(function () {
    alert("jQuery is now loaded");
});

but window.jQuery never gets set.

There are not many details we can build answers on top of. The code above perfectly works. — Adam Azad
– Adam Azad, Commented Jan 3, 2018 at 9:41
@AndroidDev I was asking Vinod about "chrome's inbuilt jquery", because I doubt it too. If your second page is in a sub folder, you have to add ../ in the script relative path. — Serge K.
– Serge K., Commented Jan 3, 2018 at 9:52
As far as I know, the Chromium that electron uses does have a $ in window. I don't think it is jQuery though, just an in-built thing.. — Solver
– Solver, Commented Jan 3, 2018 at 9:52

Solver · Accepted Answer · 2018-01-03 09:47:51Z

2

In Electron, jquery isn't loaded as a script.

Use this instead (in your header):

<script>window.$ = window.jQuery = require('jquery');</script>

and install jQuery as a package with npm install --save jquery

If that doesn't work, try using

<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>

//put all of scripts here
<script src="path/to/jquery"></script>

<script>if (window.module) module = window.module;</script>

Or you can use:

<script>window.$ = window.jQuery = require('./path/to/jquery');</script>

edited Jan 3, 2018 at 9:47

answered Jan 3, 2018 at 9:41

Solver

6187 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Johann Over a year ago

Actually it is. I have no problem loading jQuery or any script in Electron using the script tag.

Solver Over a year ago

Sorry, I don't understand. Have you tried this? I'm not sure, but this is what I use in my projects

Johann Over a year ago

The second solution works. I'm not sure why this is necessary since my startup page just loads jQuery the normal way with just a script tag. This appears to be an issue with Electron. Thanks.

Collectives™ on Stack Overflow

jQuery not loading when reloading window

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related