Say I have the following:
<body>
<script src='script.js'></script>
<script>myFunction()</script>
</body>
and inside script.js I had the following:
function myFunction() {
// code to run
}
However this is not working for me. and I get the console error that the function is not defined.
Related
There are two files here in the same folder.
I am trying to invoke a function named greet of app1 in app2.
app1.html
<script>
function greet() {
alert('hello from App1')
}
// greet() // commented out code
</script>
app2.html
<script type="text/javascript" src="./app1.html"></script>
<script>
function app2() {
alert('app2')
}
app2()
greet() // this line of code is not working
</script>
If you want to call the file in an another js file then you have to refer that file in the calling file.
Ex.
Refer the files in the head section.
<head>
<script src="File2.js" type="text/javascript"></script>
<script src="File1.js" type="text/javascript"></script>
</head>
you can have your body tag something like this:
<body>
<script type="text/javascript">
Method2(); // Where you want to call method from another JS.
</script>
</body>
then, using first file
File1.js
function Method1(number) {
alert("Method1");
}
File2.js
function Method2() {
Method1("Method1 is called in Method2");
}
I would recomend have separate external js files instead of an embedded <script> tag, but maybe this can help
How to include js file in another js file?
I am trying to accomplish something similar to: Calling a function from one JavaScript file which requires another
Essentially, I have index.php, which is the main file for the home page. Within the index file, I am calling a javascript function from another js file.
<script src="js/data.js"></script>
<script>(go_call())</script>
within data.js:
function go_call(){
alert('working');
}
I get the following error: Uncaught ReferenceError: go_call is not defined
UPDATE 1:
My original code is working fine in IE, but this error I have occurs in google chrome.
A function cannot be called unless it was defined in the same file or one loaded before the attempt to call it.
A function cannot be called unless it is in the same or greater scope then the one trying to call it.
It should work like this:
1) within data.js
function go_call(){
alert('working');
}
2) Within file2.js
function clickedTheButton() {
go_call();
}
3) Html File:
<html>
<head>
</head>
<body>
<button onclick="clickedTheButton()">Click me</button>
<script type="text/javascript" src="data.js"></script>
<script type="text/javascript" src="file2.js"></script>
</body>
</html>
I followed this to set up the node.js server: Using node.js as a simple web server
So I installed the serve-static npm.
I then created a file called file called test.html with the following code
<html>
<head>
<h2>Google</h2>
</head>
<body>
<button onclick="test()">Click me</button>
</body>
</html>
<script src="http://code.jquery.com/jquery-3.3.1.min.js" type="text/javascript">
function test() {
console.log('test');
}
</script>
When I click on the button, I get:
Uncaught ReferenceError: test is not defined
at HTMLButtonElement.onclick (test.html:8)
and nothing else. This code looks ok...? Why is this function not found?
Remove your src part if you want to have your own function in between your script tags.
<script src="http://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
function test() {
console.log('test');
}
</script>
Also, you should put your scripts before your </body>
Put your javascript just before closing body tag (</body>)
And in your case you are binding event handler in the html itself, in this case you have to define those functions before you use them.
In this case put test() function code in head tag. It will work fine
Your JavaScript (script tag) is outside of html element. Put it in head or body.
I am working with ASP.net and JQuery.
In one Aspx page i have many Js pages included.
Now i added one more Js file(say page1.js) and i was calling a function from page1.js to another js file(page2.js) which was also included in the same Aspx page.
When i tried calling the method(Page1Func) from page2.js i was getting undefined error message.
ASPX Page:
<script src="<%= SomeCommonFunc.GetResolvedUrl("~/Page1.js") %>" type="text/javascript"></script>
<script src="<%= SomeCommonFunc.GetResolvedUrl("~/Page2.js") %>" type="text/javascript"></script>
Page1.js
function page1Func(){
//Some code
}
Page2.js
function page2Func(){
//Some code
page1Func(); // giving undefined error message
}
so i did this:
function page2Func(){
var someFunc = Page1Func; //it worked
someFunc();
}
And it worked.I'm not sure why this message was coming.i have also tried to change the order to include of Js file in ASPX page.
it would be great if someone can help me in explaining this behavior.
P.S : I have checked on internet and didn't get the proper answer for it.
Thanks.
The function could be called as if it was in the same JS File as long as the file containing the definition of the function has being loaded before the first use of the function.
I.e.
File1.js
function alertNumber(number) {
alert(number);
}
File2.js
function alertOne() {
alertNumber("one");
}
HTML
<head>
....
<script src="File1.js" type="text/javascript"></script>
<script src="File2.js" type="text/javascript"></script>
....
</head>
<body>
....
<script type="text/javascript">
alertOne();
</script>
....
</body>
If your code is something like this then there is no chance of giving undefined at all
Here is Plunker implementation
HI i am facing some problem while calling function from index.html on load event
it return error readjson is not defined in console.
index.html
<script type="text/javascript">
$(window).load(function () {
readjson('a','s');
});
</script>
main.js file
<script type="text/javascript">
function readjson(val1,val2){
//some code
}
</script>
Can anyone tell me why it is not able to call, i have link main.js file to index.html
JavaScript files shouldn't include any HTML.
Remove <script type="text/javascript"> and </script> from main.js.
You should see an error when that file is loaded (along the lines of Unexpected token <).
Call it like this inside the js file without the "script" tag :
function readjson(val1,val2){
//some code
}
In index.html you need the "script"
And follow the advice given in the comments, always include first the .js file and then the function in the index.html
Did you add jquery link properly??
If not, you should add jquery link for $(window) to be called. such as..
<script src="http://code.jquery.com/jquery-latest.js"></script>
If you actually have two script declarations as you are showing here the the window load will fire first. It then look for your function, which has not been created yet. That's why you are getting undefined.
You could have one script declaration on the page and place your function in the load function.
<script>
$(window).load(function () {
readjson('a','s');
function readjson(val1,val2){
//some code
}
});
</script>
Remove tags from main.js:
<script type="text/javascript"> and </script>
and remember to include jquery and main.js with:
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.min.js"></script>
<script src="test.js"></script>