By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,695 Members | 1,597 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,695 IT Pros & Developers. It's quick & easy.

how to activate javascript file from html page

100+
P: 236
Hi All,

The html page(see item a below) is calling javascript(item b below), but cant work as the page show blank. Not sure if the method of calling is wrong(in terms of default directory) or javascript is wrong.

using 127.0.0.1/htmlscript.html below to call the java script embedded in the following html script.

I am using apache server and apache server have error 304(not modified)

Been trying many methods for past 1 week...

Not sure where went wrong?

Thanks and Best Rgds,
Andrew

a) html page
=========

Expand|Select|Wrap|Line Numbers
  1. <html> 
  2.    <head>
  3. <SCRIPT LANGUAGE="JAVASCRIPT" SRC="j_pop4.js"
  4. TYPE="TEXT/JAVASCRIPT">
  5. <!--
  6.  
  7. //-->
  8. </SCRIPT>
  9.  </head> 
  10.  
  11.    <body>
  12.    </body>
  13. </html>
  14.  
  15.  
b) javascript
=========

Expand|Select|Wrap|Line Numbers
  1. <html>  
  2.    <head>  
  3. <TITLE>Java Popup Window Example with size, title and background colour parameters</TITLE> 
  4. <script language="JavaScript1.2" type="text/javascript"> 
  5. <!-- ; 
  6. var newwindow; 
  7. var wheight = 0, wwidth = 0; 
  8.  
  9. function popitup5(url, title, iwidth, iheight, colour) { 
  10. var pwidth, pheight; 
  11.  
  12. if ( !newwindow || newwindow.closed ) { 
  13. pwidth=iwidth+30; 
  14. pheight=iheight+30; 
  15. newwindow=window.open('','htmlname','width=' + pwidth +',height=' +pheight + ',resizable=1,top=50,left=10'); 
  16. wheight=iheight; 
  17. wwidth=iwidth; 
  18.  
  19. if (wheight!=iheight || wwidth!=iwidth ) { 
  20. pwidth=iwidth+30; 
  21. pheight=iheight+90; 
  22. newwindow.resizeTo(pwidth, pheight); 
  23. wheight=iheight; 
  24. wwidth=iwidth; 
  25.  
  26. newwindow.document.clear(); 
  27. newwindow.focus(); 
  28. newwindow.document.writeln('<html> <head> <title>' + title + '<\/title> <\/head> <body bgcolor= \"' + colour + '\"> <center>'); 
  29. newwindow.document.writeln('<img src=' + url + ' title=\"' + title + '\" alt=\"' + title + '\" >'); 
  30. newwindow.document.writeln('<\/center> <\/body> <\/html>'); 
  31. newwindow.document.close(); 
  32. newwindow.focus(); 
  33.  
  34. // Routines to tidy up popup windows when page is left 
  35. // Call with an onUnload="tidy5()" in body tag 
  36.  
  37. function tidy5() { 
  38. if (newwindow && !newwindow.closed) { newwindow.close(); } 
  39.  
  40. // Based on JavaScript provided by Peter Curtis at www.pcurtis.com --> 
  41. </script> 
  42.  
  43.   </head>  
  44.  
  45. <BODY onUnload="tidy5()" >  
  46.  
  47. <A HREF="javascript:popitup5('0002.jpg','Temple of Heavenly Bliss', 384, 288,'white')"><IMG SRC="0002.jpg" WIDTH="160" BORDER="0" HEIGHT="120" HSPACE="10" VSPACE="5" ALT="Temple of Heavenly Bliss" TITLE="Temple of Heavenly Bliss" ALIGN=left></A>  
  48.  
  49.  
  50.  
  51.    </body> 
  52. </html> 
  53.  
  54.  
Nov 8 '08 #1
Share this Question
Share on Google+
17 Replies


gits
Expert Mod 5K+
P: 5,390
you may find your answer here ... in the JavaScript forum.

regards
Nov 8 '08 #2

Expert 100+
P: 397
you may find your answer here ... in the JavaScript forum.

regards
And a doctype will be needed (if you intend to support any version of Internet Explorer).
Nov 8 '08 #3

100+
P: 236
Hi Sir,

Read the java weblink you gave and ,

Is it something like that below? tried many times and different ways, used html to activate javascript and it did not work. and used html to activate java embedded in html page, but cant work.

Thanks and Best Rgds,
Andrew

HTML
====
Expand|Select|Wrap|Line Numbers
  1.  
  2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  3.  
  4. <html> 
  5.    <head>
  6. <SCRIPT LANGUAGE="JAVASCRIPT" SRC="j_pop4.js"
  7. TYPE="TEXT/JAVASCRIPT">
  8. <!--
  9.  
  10. //-->
  11. </SCRIPT>
  12.  </head> 
  13.  
  14.    <body>
  15.    </body>
  16. </html>
  17.  
  18.  

JAVAscript that is activated
====================
Expand|Select|Wrap|Line Numbers
  1.  
  2. <TITLE>Java Popup Window Example with size, title and background colour parameters</TITLE>
  3. <script language="JavaScript1.2" type="text/javascript">
  4. <!-- ;
  5. var newwindow;
  6. var wheight = 0, wwidth = 0;
  7.  
  8. function popitup5(url, title, iwidth, iheight, colour) {
  9. var pwidth, pheight;
  10.  
  11. if ( !newwindow || newwindow.closed ) {
  12. pwidth=iwidth+30;
  13. pheight=iheight+30;
  14. newwindow=window.open('','htmlname','width=' + pwidth +',height=' +pheight + ',resizable=1,top=50,left=10');
  15. wheight=iheight;
  16. wwidth=iwidth;
  17. }
  18.  
  19. if (wheight!=iheight || wwidth!=iwidth ) {
  20. pwidth=iwidth+30;
  21. pheight=iheight+90;
  22. newwindow.resizeTo(pwidth, pheight);
  23. wheight=iheight;
  24. wwidth=iwidth;
  25. }
  26.  
  27. newwindow.document.clear();
  28. newwindow.focus();
  29. newwindow.document.writeln('<html> <head> <title>' + title + '<\/title> <\/head> <body bgcolor= \"' + colour + '\"> <center>');
  30. newwindow.document.writeln('<img src=' + url + ' title=\"' + title + '\" alt=\"' + title + '\" >');
  31. newwindow.document.writeln('<\/center> <\/body> <\/html>');
  32. newwindow.document.close();
  33. newwindow.focus();
  34. }
  35.  
  36. // Routines to tidy up popup windows when page is left
  37. // Call with an onUnload="tidy5()" in body tag
  38.  
  39. function tidy5() {
  40. if (newwindow && !newwindow.closed) { newwindow.close(); }
  41. }
  42.  
  43. // Based on JavaScript provided by Peter Curtis at www.pcurtis.com -->
  44. </script>
  45.  
  46.  
  47.  
  48.  
  49. <A HREF="javascript:popitup5('0002.jpg','Temple of Heavenly Bliss', 384, 288,'white')"><IMG SRC="0002.jpg" WIDTH="160" BORDER="0" HEIGHT="120" HSPACE="10" VSPACE="5" ALT="Temple of Heavenly Bliss" TITLE="Temple of Heavenly Bliss" ALIGN=left></A> 
  50.  
  51.  
  52.  
  53. #The code can be copied and pasted. If you copy by hand beware as it is impossible to tell 2x single quotes '' from a double quotes " in many proportion spaced character sets (fonts).
  54.  
  55.  
Nov 9 '08 #4

100+
P: 236
Hi Sir,

Something is missing and I tried many different ways and means including alert and still cant work. Please see below a)html and b)javascript. I activated the js script from default apache directory which is htdocs directory where I placed the javascript if you refer the my html above.

Installed IE6


a) html
=====
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
  2.  
  3. <html> 
  4. <head>
  5. <SCRIPT LANGUAGE="JAVASCRIPT" SRC="j_pop5.js"
  6. TYPE="TEXT/JAVASCRIPT">
  7. <!--
  8.  
  9. //-->
  10. </SCRIPT>
  11. </head> 
  12.  
  13. <body>
  14. </body>
  15. </html>
  16.  
  17.  

javascript
=======

Expand|Select|Wrap|Line Numbers
  1. Expand|Select|Wrap|Line Numbers <script language="JavaScript1.2" type="text/javascript"> 
  2. <!-- ; 
  3. alert("Welcome to my world!!!"); 
  4.  
  5.  
Nov 9 '08 #5

gits
Expert Mod 5K+
P: 5,390
there is nothing missing ... it is just too much ... leave the script-tags out and drop those useless comment ... just the alert() should be left in the JS-file ... here is an example ...

regards
Nov 9 '08 #6

Markus
Expert 5K+
P: 6,050
--Moved to Javascript.

Another thing to note: everything should be lowercase if you wish to comply with HTML standards. The 'language' attribute is deprecated (not needed or supported).
Nov 9 '08 #7

gits
Expert Mod 5K+
P: 5,390
hi happyse27,

i just closed the following threads that are handling the same issue:

http://bytes.com/forum/thread851230.html
http://bytes.com/forum/thread852374.html

please try to keep one thread for a specific problem ... since otherwise it would lead to just spreaded information and answers ... i don't feel like merging all the threads since some different lines of code are posted there and some different hints and answers but as far as i could see the problem is always the same and so we should just use this thread here. i linked everything together so we could jump from thread to thread.

kind regards
MOD
Nov 9 '08 #8

100+
P: 236
Hi Sir,

Thanks and noted, sorry and apologize because I did that because I dont know if it belongs to javascript issue or html's therefore did double post. Anyway, I tried your method. But still the alert message below did not pop up... Checked apache access log is it error 500 and error 543. Kindly advise what is happening???


The example you given..
=================
this is the page where a script is included:
Expand|Select|Wrap|Line Numbers
  1. <html> 
  2.     <head> 
  3.         <script type="text/javascript" src="foo.js"/> 
  4.     </head> 
  5.     <body> 
  6.     </body> 
  7. </html> 
  8.  
and this is in the file foo.js:
Expand|Select|Wrap|Line Numbers
  1. alert('foo'); 
  2.  
Error from apache access if I put javapop.js into apache/cgi-bin directory
===============================================
127.0.0.1 - - [09/Nov/2008:22:00:28 -0800] "GET /javapop.html HTTP/1.1" 304 -
127.0.0.1 - - [09/Nov/2008:22:00:28 -0800] "GET /cgi-bin/javapop.js HTTP/1.1" 500 543

Error from apache access if I put javapop.js into apache/htdocs directory
===============================================
127.0.0.1 - - [09/Nov/2008:21:56:24 -0800] "GET /javapop.html HTTP/1.1" 304 -
127.0.0.1 - - [09/Nov/2008:21:56:24 -0800] "GET /javapop.js HTTP/1.1" 304 -
Nov 9 '08 #9

gits
Expert Mod 5K+
P: 5,390
just clear your browser cache first and try the second method again ... does the files just contain the example?
Nov 9 '08 #10

P: 31
Here is the code you need. It needs to be nested inside the head element.
<head>
<script src="anyfile.js" type="text/javascript"></script>
</head>

Also do not forget to close the Script and pay attention to capitals or non.
Nov 9 '08 #11

100+
P: 236
Hi Sirs,

Thanks!!!!!!!!!!!!!! It works. Activated from html the .js file. Cheers...

</script> was missing. Cheers...


Best Rgds,
Andrew
Nov 9 '08 #12

100+
P: 236
Hi All,

I activated another script from the similar html page(see item a) below. Cant work. Taken out the html tag in .js file still did not work. Not sure where is the problem??


Thanks again,
Andrew


html code
=======
Expand|Select|Wrap|Line Numbers
  1.  
  2. html>
  3.     <head> 
  4.         <script type="text/javascript" src="javapop2.js"/> </script>
  5.     </head> 
  6.     <body> 
  7.     </body> 
  8. </html> 
  9.  
  10.  

javascript
=======

Expand|Select|Wrap|Line Numbers
  1. <HTML>
  2. <HEAD>
  3. <TITLE>Java Popup Window Example with size, title and background colour parameters</TITLE>
  4. <script language="JavaScript1.2" type="text/javascript">
  5. <!-- ;
  6. var newwindow;
  7. var wheight = 0, wwidth = 0;
  8.  
  9. function popitup5(url, title, iwidth, iheight, colour) {
  10. var pwidth, pheight;
  11.  
  12. if ( !newwindow || newwindow.closed ) {
  13. pwidth=iwidth+30;
  14. pheight=iheight+30;
  15. newwindow=window.open('','htmlname','width=' + pwidth +',height=' +pheight + ',resizable=1,top=50,left=10');
  16. wheight=iheight;
  17. wwidth=iwidth;
  18. }
  19.  
  20. if (wheight!=iheight || wwidth!=iwidth ) {
  21. pwidth=iwidth+30;
  22. pheight=iheight+90;
  23. newwindow.resizeTo(pwidth, pheight);
  24. wheight=iheight;
  25. wwidth=iwidth;
  26. }
  27.  
  28. newwindow.document.clear();
  29. newwindow.focus();
  30. newwindow.document.writeln('<html> <head> <title>' + title + '<\/title> <\/head> <body bgcolor= \"' + colour + '\"> <center>');
  31. newwindow.document.writeln('<img src=' + url + ' title=\"' + title + '\" alt=\"' + title + '\" >');
  32. newwindow.document.writeln('<\/center> <\/body> <\/html>');
  33. newwindow.document.close();
  34. newwindow.focus();
  35. }
  36.  
  37. // Routines to tidy up popup windows when page is left
  38. // Call with an onUnload="tidy5()" in body tag
  39.  
  40. function tidy5() {
  41. if (newwindow && !newwindow.closed) { newwindow.close(); }
  42. }
  43.  
  44. // Based on JavaScript provided by Peter Curtis at www.pcurtis.com -->
  45. </script>
  46.  
  47.  
  48. </HEAD> 
  49.  
  50. <BODY onUnload="tidy5()" > 
  51.  
  52. <A HREF="javascript:popitup5('0002.jpg','Temple of Heavenly Bliss', 384, 288,'white')"><IMG SRC="0002.jpg" WIDTH="160" BORDER="0" HEIGHT="120" HSPACE="10" VSPACE="5" ALT="Temple of Heavenly Bliss" TITLE="Temple of Heavenly Bliss" ALIGN=left></A> 
  53.  
  54. </BODY>
  55. </HTML>
  56.  
  57.  
  58.  
Nov 9 '08 #13

Markus
Expert 5K+
P: 6,050
This thread is confusing me greatly.

You say the second part of the code in your most recent post is the javascript file? If so, there can be NO html in there whatsoever. You need not the opening and closing javascript elements, either.
Nov 9 '08 #14

gits
Expert Mod 5K+
P: 5,390
it confuses me too ... first:

this:

[HTML]<script type="text/javascript" src="javapop2.js"/></script>[/HTML]
is simply wrong, either use:

[HTML]<script type="text/javascript" src="javapop2.js"></script>
[/HTML]
or:

[html]<script type="text/javascript" src="javapop2.js"/>[/html]
together with a proper doctype. and every file that you post as a javascript-file is in fact a html-file ... should we always tell you to leave out all html in those files?

regards
Nov 9 '08 #15

100+
P: 236
Hi Sir,

Thanks. It is fine now. Could work out what is the exact format of Javascript.

Sorry, but I did state in above that I have used bare javascript and I thought html can be inserted in javascript also.

Anyway, I still have problem popping out the image from clicking on same image. I modified the javascript(see item b) below and html(see item a)...

Any idea what is the problem?? Thanks in advance. The references I took for above earlier example is www.pcurtis.com
and the codes below(modified the a href to be placed in html is http://www.javascriptkit.com/script/...opimage2.shtml

Best Rgds,
Andrew

html with <a href>
=============
Expand|Select|Wrap|Line Numbers
  1. <html>
  2.     <head> 
  3.         <script type="text/javascript" src="javapop4.js"> </script>
  4.     </head> 
  5.     <body> 
  6.     <a href="#" onClick="jkpopimage('0001.jpg', 325, 445, 'Breakfast is served.'); return false">
  7. Breakfast pancakes</a>
  8.     </body> 
  9. </html> 
  10.  
  11.  
javascript .js
=======

Expand|Select|Wrap|Line Numbers
  1. // JK Pop up image viewer script- By JavaScriptKit.com
  2. // Visit JavaScript Kit (http://javascriptkit.com)
  3. // for free JavaScript tutorials and scripts
  4. // This notice must stay intact for use
  5.  
  6. var popbackground="lightskyblue" //specify backcolor or background image for pop window
  7. var windowtitle="Image Window"  //pop window title
  8.  
  9. function detectexist(obj){
  10. return (typeof obj !="undefined")
  11. }
  12.  
  13. function jkpopimage(imgpath, popwidth, popheight, textdescription){
  14.  
  15. function getpos(){
  16. leftpos=(detectexist(window.screenLeft))? screenLeft+document.body.clientWidth/2-popwidth/2 : detectexist(window.screenX)? screenX+innerWidth/2-popwidth/2 : 0
  17. toppos=(detectexist(window.screenTop))? screenTop+document.body.clientHeight/2-popheight/2 : detectexist(window.screenY)? screenY+innerHeight/2-popheight/2 : 0
  18. if (window.opera){
  19. leftpos-=screenLeft
  20. toppos-=screenTop
  21. }
  22. }
  23.  
  24. getpos()
  25. var winattributes='width='+popwidth+',height='+popheight+',resizable=yes,left='+leftpos+',top='+toppos
  26. var bodyattribute=(popbackground.indexOf(".")!=-1)? 'background="'+popbackground+'"' : 'bgcolor="'+popbackground+'"'
  27. if (typeof jkpopwin=="undefined" || jkpopwin.closed)
  28. jkpopwin=window.open("","",winattributes)
  29. else{
  30. //getpos() //uncomment these 2 lines if you wish subsequent popups to be centered too
  31. //jkpopwin.moveTo(leftpos, toppos)
  32. jkpopwin.resizeTo(popwidth, popheight+30)
  33. }
  34. jkpopwin.document.open()
  35. jkpopwin.document.write('<html><title>'+windowtitle+'</title><body '+bodyattribute+'><img src="'+imgpath+'" style="margin-bottom: 0.5em"><br />'+textdescription+'</body></html>')
  36. jkpopwin.document.close()
  37. jkpopwin.focus()
  38. }
  39.  
  40.  
Nov 10 '08 #16

100+
P: 236
Hi Sir,

It is fine now. My latest code posted is fine. The cache somehow was very persistent. Had to reboot pc. Thanks...


Best Rgds,
Andrew
Nov 10 '08 #17

gits
Expert Mod 5K+
P: 5,390
glad to hear you got it working now ;)

kind regards
Nov 10 '08 #18

Post your reply

Sign in to post your reply or Sign up for a free account.