Why am I getting e.indexOf is not a function when simply loading another Javascript file with jQuery?-ThrowExceptions

Exception or error:

I have a very simple page I was building to test with.

HTML

<!DOCTYPE html>

<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="css/style.css">
    <script type="text/javascript" src="js/jquery-3.4.1.min.js" defer></script>
    <script type="text/javascript" src="js/script.js" defer></script>
</head>
<html>

<body>
    <div>
    <div id="loading">
        <img src="images/loading.gif" alt="Loading..." />
    </div>
    <div>
        <p>The page has loaded!</p>
        <input type="button" id="wait" value="Do Something">
    </div>
    </div>
</body>

</html>

JS

$(window).on('load', function() {
     overlayOn();
});

$(document).on('ready', function() {
    document.getElementById("wait").addEventListener('click', doSomething);
    overlayOff();
});

function overlayOn() {
    document.getElementById("loading").style.display = "block";
}

function overlayOff() {
    document.getElementById("loading").style.display = "none";
}

function doSomething() {
    alert("somthing");
    const sleep = (milliseconds) => {
        return new Promise(resolve => setTimeout(resolve, milliseconds));
    }

    overlayOn();

    sleep(1000).then(() => {
        window.location.replace(window.location.href);
    });
}

The strange thing is that I get an error from jQuery, TypeError: e.indexOf is not a function, when I try to include script.js. It does not matter what the contents of that file are. I have even tried it with an empty file. But if I remove the script.js line from the HTML file, I do not receive the error.

I thought maybe the browser was caching something with script.js but i cleared the cache, removed everything from script.js and still have the same issue. I have the issue in both Chrome and FF. I have not run into this issue in the past and I have done it the same way as this.

EDIT

I added in the JS and another portion of the HTML. I am starting to test the simulation of something in the backend for context. But as I said, if I have a blank script.js I am getting the same error message, which seems weird to me – hence why I removed everything from the script to see.

How to solve:

Leave a Reply

Your email address will not be published. Required fields are marked *