How can I access the function which inside different js file in JQUERY?

Question

There is a script which named Normal.js in the HTML:

$(function () {    
    function WhiteNav() {
        $("#LOGO>img").attr('src', '/images/LOGOWhite.svg');
        $("#NavUL a").css("color", "#cecece");
    }    
});

And here is the struct of the HTML as below:

However, after the browser(Chrome) ran the WhiteNav function in the script, it reported this error and the WhiteNav failed:

Why it turned out to be this? It seems like I ran the code with a different file, is it right? I tried the way as Why jQuery click doesn't work when included in a separate file said but failed again.

What's wrong with this? How can I solve this problem? Would you please help me? Thank you.

@TylerRoper Thank you very much, now it works! Would you mind I create a new answer with what you said? — 102425074, Jan 17 '19 at 03:15

Tyler Roper · Accepted Answer · 2019-01-17T03:19:56.230

You're declaring WhiteNav inside of a function() { ... }, meaning it will only be accessible from within that function.

Simply remove the $(function () { ... }); from around it, and it will be declared globally - accessible from anywhere after it's declaration.

As a side-note, you can remove $(function () { ... }); from your internal <script> snippet as well. $(function () { ... }); and $(document).ready(function() { ... }); are identical and so there is no need for both. The latter is just shorthand.

How can I access the function which inside different js file in JQUERY?

1 Answers1