Calling a Function in External JS File

DMN · 03-16-2013, 03:42 AM

Hi All, I'm very new to Javascript and would like some pointers. If I have multiple functions in the same external Javascript file, how would I call a particular function inside that external JS file from a web page. For instance suppose I have a JS file called myJSFunction.js and within this file I have three functions like the following:

 Function1()

{

Do Something

}



Function2()

{

Do What Ever

}



Function3()

{

Do Stuff

}

How would I call Function2() from a web page? Any suggestion is greatly appreciated, thanks in advance.

jmrker · 03-16-2013, 04:24 AM

Have you tried:

<script type="text/javascript" src="myJSFunction.js"></script>

Some place before the functions are called, but after elements of page have been loaded.
Usually just before the ending </body> tag.

DMN · 03-16-2013, 05:07 AM

Hi, thanks for replying. I know about linking to an external JS file as you have mentioned above, but what I would like to know is after placing a link to the external JS file in the script element, can I then call Function1, Function2, or Function3 in the body of my page like the following:

Code:

<body>
      <div>
         <a href="javascript:Function1()">Click Here </a><br>
         <a href="javascript:Function2()">Click Here </a><br>
         <a href="javascript:Function3()">Click Here </a>
      </div>
</body>

felgall · 03-16-2013, 07:28 AM

Never attach JavaScript insiide the href attribute.

Best is to not jumble any of the JavaScript in the HTML at all and put ALL the JavaScript in the external file.

<a id="a1" href="nojs.htm">click here</a>

and in the external HTML

document.getElementById('a1').onclick = function() {..... ; return false;}

the code for your function goes in place of the ..... in the above command that is in the external JavaScript file.

You attach JavaScript in the external file to HTML in the web page using the id of the element you want to attach it to (or in some cases class names if the same code is to be attached to multiple elements

The code suggested by DMN was considered to be bad practice in Netscape 2 and worse practice in every browser since then.

Philip M · 03-16-2013, 09:41 AM

Quote:

Originally Posted by DMN

How would I call Function2() from a web page?

You call (execute) the function when an event happens. For example:

Code:

<input type = "text" id = "mytext" onblur = "function1()">
<input type = "button" value = "Click Me" onclick = "function2()">
<img src="logo1.jpg" onclick="function3()">
<select id = "myselect" onchange = "function4()">
<img src="smiley.gif" alt="Smiley"  onmouseover="function5(this)" >

Is this what you mean?

I like fish and chips, but you can't get that there [Paris] - all you can get are snails' legs. - Commentator Talksport