reference javascript from external file doesn't work

websj06
Jr. Member

Posts: 31

« on: September 27, 2006, 05:08:17 PM »

Dear Forum Members:

I try to show a status bar message by refering JavaScript from an external file. The status bar message won't show when I view html file in IE browser/FireFox browser. Could you take a look my code and tell me what's went wrong? Thanks!

Here is the code used in my html file to refer to external JavaScript file. (I also tried file extension as status_barMessage.js. It won't work either)
<script src="status_barMessage.htm" type="text/javascript"></script>

my script code look like this:

<html>

<head>
<title>hompage layout</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<script language="JavaScript" type="text/javascript">

var frontPart, backPart;
var myMsg = "Welcome to California National Park Page!";
var i = 0;

function scrollMsg() {
frontPart = myMsg.substring(i, myMsg.length);
backPart = myMsg.substring(0, i);

window.status = frontPart + backPart;

if (i < myMsg.length) i++;
else i = 0;

setTimeout("scrollMsg()", 200) ;
}

</script>

</head>

<body style="background-color: #99CC99;" onload="scrollMsg();">

</body>
</html>

###################################################################3
My html file source code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>

<html>


<head>
<title>California National Parks</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keyword" content="national park, rewood national park, yosemite, death valley" />
<meta name="description" content="california national, highlights, park information, hiking" />

</head>

<body style="color: #996600; font-family: Times, Helvetica, sans-serif; background-image: url(images/creamparch.jpg);">



<script src="status_barMessage.htm" type="text/javascript"></script>

<h2>Welcome to COIN63!</h2>
</body>
</html>

Jeff
9-27-06


	Report to moderator Logged

Andy
Administrator
Veteran

Posts: 5 752

Re: reference javascript from external file doesn't work

« Reply #1 on: September 27, 2006, 11:11:35 PM »

Hi Jeff,

I think the problem is that your external file is not a Javascript file, it's an html file. You should only have javascript code in this file because it's effectively cutted and pasted into your web page at the script insertion point.

So your external file should only contain this code:

Code:

var frontPart, backPart;
var myMsg = "Welcome to California National Park Page!";
var i = 0;

function scrollMsg() {
frontPart = myMsg.substring(i, myMsg.length);
backPart = myMsg.substring(0, i);

window.status = frontPart + backPart;

if (i < myMsg.length) i++;
else i = 0;

setTimeout("scrollMsg()", 200) ;
}

Save the file as status_barMessage.js i.e. not using a .htm extension.

In your html page, refer to the script like this:
<script src="status_barMessage.js" type="text/javascript"></script>

Now the javascript code should be inserted correctly. Note, that I didn't test your code so it may have some bugs.

Andy


	Report to moderator Logged

IP Address Trace
Karaoke on PC

websj06
Jr. Member

Posts: 31

Re: reference javascript from external file doesn't work

« Reply #2 on: September 28, 2006, 06:15:16 AM »

Hello Andi:

Thanks for pointing out my error. I　ｃｈａｎｇｅｄ　ｆｉｌｅ extension to .js. But The status bar message won't display. I　ｃｏｕｌｄｎ＇ｔ　ｆｉｎｇｕｒｅ　ｏｕｔ　ｗｈａｔ　ｗｅｎｔ　ｗｒｏｎｇ！　Ｃｏｕｌｄ　ｙｏｕ　ｈｅｌｐ　ｍｅ　ｔｏ　ｔｅｓｔ　ｔｈｅ　ｃｏｄｅ　ａｎｄ　ｔｅｌｌ　ｍｅ　ｗｈａｔ＇ｓ　ｗｒｏｎｇ？　Ｔｈａｎｋｓ！

In FireFox browser JavaScript Console show one error. It says, "Missing } in XML　ｅｘｐｒｅｓｓｉｏｎ＂

　ｔｈｅ　ｅｒｒｏｒ　ｐｏｉｎｔｓ　ｔｏ　－－＞ frontPart = myMsg.substring(i, myMsg.length);　（I　ｄｉｄｎ＇ｔ　ｓｅｅ　ａｎｙｔｈｉｎｇ　ｗｒｏｎｇ　ｗｉｔｈ　ｔｈｉｓ　ｌｉｎｅ　ｏｆ　ｔｈｅ　ｃｏｄｅ）

　　ｈｅｒｅ　ａｒｅ　ｔｈｅ　ｃｏｄｅ　ｆｒｏｍ　ｍｙ　ｔｗｏ　ｆｉｌｅｓ：

a)　ｅｘｔｅｒｎａｌ　ＪａｖａＳｃｒｉｐｔ　Ｆｉｌｅ

Code:

ｂ） HTML　ｆｉｌｅ　ｔｈａｔ　ｒｅｆｅｒｓ　ｔｏ　ｅｘｔｅｒｎａｌ　ＪａｖａＳｃｒｉｐｔ　ｆｉｌｅ

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>
<title>California National Parks</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keyword" content="national park, rewood national park, yosemite, death valley" />
<meta name="description" content="california national, highlights, park information, hiking" />

</head>

<body style="color: #996600; font-family: Times, Helvetica, sans-serif; background-image: url(images/creamparch.jpg);">



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

<h2>Welcome to COIN63!</h2>
</body>

</html>

Ｊｅｆｆ
９－２７－０６


	Report to moderator Logged

Andy
Administrator
Veteran

Posts: 5 752

Re: reference javascript from external file doesn't work

« Reply #3 on: September 28, 2006, 02:12:30 PM »

Quote

So your external file should only contain this code:

You added some extra lines.

Plus you didn't call the actual function that does the scrolling.

Here is the working code for the external .js file Grin

Code:

var frontPart, backPart;
var myMsg = "Welcome to California National Park Page!";
var i = 0;

scrollMsg();

function scrollMsg() {
frontPart = myMsg.substring(i, myMsg.length);
backPart = myMsg.substring(0, i);

window.status = frontPart + backPart;

if (i < myMsg.length) i++;
else i = 0;

setTimeout("scrollMsg()", 200) ;
}

p.s. it will only work in Internet Explorer (or others?) since Firefox doesn't let Javascript add text to the status bar as far as I know.

Andy


« Last Edit: September 28, 2006, 02:54:51 PM by Andy »	Report to moderator Logged

IP Address Trace
Karaoke on PC

websj06
Jr. Member

Posts: 31

Re: reference javascript from external file doesn't work

« Reply #4 on: September 28, 2006, 04:17:45 PM »

Hello Andy:

I took off the <script> tag in .js file and added onLoad=scrollMsg(); in <body> tag of html file. This time it worked

.

Thanks for you help! I now know how to reference a function in an external JavaScript file.

Jeff
9-28-06


	Report to moderator Logged

Andy
Administrator
Veteran

Posts: 5 752

Re: reference javascript from external file doesn't work

« Reply #5 on: September 29, 2006, 02:22:50 PM »

Hi Jeff,

it was kind of fun to get it working. This is a cool script, shame it doesn't work in Firefox. But IE is most popular.

Glad to be of assistance

p.s. did you notice I added the call to the function in the .js file outside of the function definition? You don't have to have it in the onload event.

Andy


	Report to moderator Logged

IP Address Trace
Karaoke on PC

Pages: [1]


Webmaster Key Forums Webmaster Corner Site Design and Web Authoring reference javascript from external file doesn't work