Hi, all!
I have a problem I hope someone smarter then me will fix :)
So, I'm integrating a javascript in my site:

<script language="JavaScript" src="/js/ortodox.js" type="text/javascript"></script>

as you can see, is in a separate .js file. The site loads too slow, because of this.
What I'd like to do is to load the javascript only when the vizitor click a particular link. I don't know if is possible, though.

Also, I found many onclick link codes that show the content of a particular hidden div or table (or whatever). However, what I don't know is: if I put the code above in a hidden div, will it still load and slow the site or it will load when the div is displayed?

Recommended Answers

All 11 Replies

what you want is possible, i demostrate that in following :

your html page content :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <script type="text/javascript" src="" id="someID"></script>
<script language="javascript" type="text/javascript">
// <!CDATA[

function Button2_onclick() {
dosome();
}

function Button1_onclick() {
document.getElementById("someID").src = "JScript.js";
}

// ]]>
</script>
</head>
<body>
    <input id="Button1" type="button" value="button1" onclick="return Button1_onclick()" />
    <input id="Button2" type="button" value="button2" onclick="return Button2_onclick()" />

</body>
</html>

your JScript.js named javascript file content:

// JScript File

function dosome()
{
    alert("something");
}

when you directly click button2, you will get error stating that function not found. if you click button 1 first, it will load the javascript file dynamically, then if you click button 1 you will see the message box.

Thanks, it doesn't work.
Maybe the .js content matters?! If so, the .js file I want to load/display when the button is clicked is this:

var Latime="100%" ; 
var Culoaretablou="#e9efff" ; 
var Culoarefont="#000080" ; 
var Culoarefereastra="#e9efff" ; 
var Culoarelink="#6699ff"
time=new Date();
var Luna=time.getMonth() + 1;
var Zi=time.getDate();
var Zi_Nume = time.getDay();
var Zia=time.getDate();
var Zia_Nume = time.getDay();
Zi_Num = Zi
Zia_Nume = Zia
Luna_Nume = Luna
Luna_Audio = Luna
Luna += ""
Zi += ""
Zia += ""
if (Luna.length != 2) Luna = "0" + Luna
if (Zi.length != 2) Zi = "0" + Zi
function MakeArray(n)
{
this.length=n
return this
}
ZiNume=new Array ("Duminica","Luni","Marti","Miercuri","Joi","Vineri","Sâmbata")
LunaNume=new Array (" ","ianuarie","februarie","martie","aprilie","mai","iunie","iulie","august","septembrie","octombrie","noiembrie","decembrie")
LunaAudio=new Array (" ","jan","feb","mar","apr","may","jun","jul","aug","sep","oct","nov","dec")
var Sus = "<TABLE cellspacing=0 cellpadding=1 border=0 width=" + Latime + " bgcolor='" + Culoaretablou + "'><TR><TD>"
Latime = Latime -4
Sus += "<TABLE cellspacing=0 cellpadding=1 border=0><TR><TD  width='100%' bgcolor='" + Culoaretablou + "'>"
Sus += "<font color='" + Culoarefont + "'><u>Calendar  Ortodox: "
Sus += ZiNume[Zi_Nume] + ", " + Zi_Num + " " + LunaNume[Luna_Nume]
Sus += "</u></font>"
Sus += "</TD></TR><TR><TD bgcolor='" + Culoarefereastra + "'>"
var Jos = "</TD></TR><TR><TD align='center' bgcolor='" + Culoaretablou + "'>"
Jos += "</TD></TR></TABLE></TD></TR></TABLE>"
var Link1 = ""
var Link2 = ""
document.write("<script language='JavaSc" + "ript' src='http://www.calendar-ortodox.ro/java/sfintii_zilei/" + LunaNume[Luna_Nume] + "/" + Zi + Luna + ".js'></sc" + "ript>")

post also the link that will load this file

look i dont think it is a good idea to load the file after the link clicked, it may still take long and it can call the function before the load completes in which case you are going to get object not found error. so i think let it be slow.

Hi, all!
I have a problem I hope someone smarter then me will fix :)
So, I'm integrating a javascript in my site:

<script language="JavaScript" src="/js/ortodox.js" type="text/javascript"></script>

as you can see, is in a separate .js file. The site loads too slow, because of this.
What I'd like to do is to load the javascript only when the vizitor click a particular link. I don't know if is possible, though.

Also, I found many onclick link codes that show the content of a particular hidden div or table (or whatever). However, what I don't know is: if I put the code above in a hidden div, will it still load and slow the site or it will load when the div is displayed?

Make a function in that js file and put all the code of js in the function. Call that function on onclick event of any link or button.

I have no ideea how to do this.

I have no ideea how to do this.

It can be done as:

<head>
<script language="javascript" type="text/javascript">
function test()
{
// write ur code here

}
</script>
</head>

And the html code will be:

<body>
<input type="submit" onclick="test()" />
</body>

If you have any problem then please post your java script code here

Thanks, m8. I almost got it working. So, first of all if I put the .js code in the function it doesn't load the script - just keeps loading forever.
So, tooking your suggestion, I'm using this code instead:

<script language="javascript" type="text/javascript">
function calendar()
{
document.write("<script language='JavaSc" + "ript' src='http://atat.ro/js/calendar-ortodox.js'></sc" + "ript>")
}
</script>
<input type="submit" onclick="calendar()" value="Calendar Ortodox" name="Calendar" />

... which works, kin of... It loads the script in a new browser window.
Can I make it load under the button, on the same page, I mean? I want the button to show on all pages and the script to load, also, on the site's pages.
BTW, here it is http://atat.ro , upper-right column, just above the social bookmark icons.
Thanks again!

Thanks, m8. I almost got it working. So, first of all if I put the .js code in the function it doesn't load the script - just keeps loading forever.
So, tooking your suggestion, I'm using this code instead:

<script language="javascript" type="text/javascript">
function calendar()
{
document.write("<script language='JavaSc" + "ript' src='http://atat.ro/js/calendar-ortodox.js'></sc" + "ript>")
}
</script>
<input type="submit" onclick="calendar()" value="Calendar Ortodox" name="Calendar" />

... which works, kin of... It loads the script in a new browser window.
Can I make it load under the button, on the same page, I mean? I want the button to show on all pages and the script to load, also, on the site's pages.
BTW, here it is http://atat.ro , upper-right column, just above the social bookmark icons.
Thanks again!

Yes it can be done as:

Make a separate file for your java script code and save it with extension ".js" as it will be "filename.js"

Place that js function in that file.

Remember not to use the script tag in that separate js file.

Place the button in your html pages and just make the same function call.

Remember to include the js file in all the pages where u need to use that button and make the same function call.

A js file can be included as:

<script src="filename.js"></script>

I hope it will be helpful to you. All the best

M8, I don't want to load the javascript when the page loads, that's the point. Your first suggestion was good, only that it loads the script in a new file. I wanted to display, for example, just under the onclick button.
So, short story, that's what I have now:

<input type="submit" onclick="test()" />
<script language="javascript" type="text/javascript">
function test()
{
document.write("<script language='JavaSc" + "ript' src='http://atat.ro/js/calendar-ortodox.js'></sc" + "ript>")
}
</script>

Q: is there a way to run it on the same page so the script will display the content under the button?
Thanks!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.