0

I have the following main.js

$(document).ready(function() {
  $.getScript('another.js', function() {
    another();
  });
});

...and the following another.js

$(function another() {
  $('section#my-section').after('<a href="#">my link</a>');
});

The directory structure is as follows:

+ my.html
+ js
  +--- main.js
  +--- another.js

another() is never called. Why? Could anyone point me in the right direction?

Thanks!

Improve this question
6
  • 1
    It depends on the order your files are being called in your HTML file. Make sure that the actual function is loaded before the other file that calls it. Commented May 12, 2014 at 15:21
  • @NickDugger not in this case... You clearly did not read the code. Commented May 12, 2014 at 15:24
  • Do I have to include them both? Won't $.getScript() fetch the another.js file without having to explicitly link to it in the HTML? Commented May 12, 2014 at 15:24
  • @NickDugger — main.js imports another.js programmatically, so it doesn't. Commented May 12, 2014 at 15:24
  • My bad, I don't use jQuery. I didn't recognize the getScript function. Commented May 12, 2014 at 15:24

2 Answers 2

Reset to default
4

You've defined another using a function expression and have passed it to $().

You need to make it a global.

Since you are calling it after you include it anyway, you presumably don't need to pass it to $(), so just get rid of that wrapper around it and it will be a function declaration (and a global).

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

4 Comments

^^ This, why does everyone think that every function call has to be wrapped in a jquery wrapper, or be an annon function??????
LoL, had heard that before but first time I actually read the wiki article. Sad but most likely true.
This doesn't work. The debugger never gets to the line where another() is called.
@Peter — How are you testing? It you are stepping through, it won't, since it isn't run linearly. You'd need a breakpoint inside the callback function. Failing that, make sure that the right script is loading. Check the Net tab in the developer tools to make sure the URL is correct and the response is what you expect. Check the JS console for errors.
1

Few things to consider:

At first you can't call another() inside main.js because it's wrapped inside $() and its not available in global scope. So you need to remove that another();

So your code in another.js will be like

function another() {
  $('section#my-section').after('<a href="#">my link</a>');
}

Then If you are testing this in your local using chrome browser it may not work.

Because chrome doesn't support local ajax call and it will give XMLHttpRequest cannot load

Anyways in firefox and other browsers it will work fine.

Just you need to load the main.js after jquery

I have tested your code in my local using firefox and it worked fine.

Improve this answer

10 Comments

$(function another() {...}); cannot work as expected when trying to call another() method again. That's said, following OP's code, OP doesn't need to recall this method on $.getScript() success callback, doesn't make sense
Strange, but it just worked.. I also tested it thrice before making this answer :P
So you are testing in some way wrongly, try to call another() method, it should be undefined on global scope. e.g: jsfiddle.net/8QNDU Here, it should be alerted twice, not only once
yes, we can't call another() from outside as its wrapped by jquery. But when the file another.js is getting loaded the code inside the function executed
I tried to execute this in browser, $(function another() { alert("rias"); }); and it given me a alert
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.