JavaScript - How Do Open External .js Files?
Hi everyone,
I'm a newbie and this is probably really easy but it just won't work! I've tried looking at various online sources but they are all either too technical or don't seem to work. I'm obviously doing something wrong! The code is posted below, it's not very long so hopefully someone will be able to debug it! Thanks lots! Original page: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>variables</title> </head> <body> <script src="displaydate.js" type="text/javascript"></script> <br> </body> </html> External displaydate.js file: Code: function todaydate(){ var today_date= new Date() var myyear=today_date.getYear() var mymonth=today_date.getMonth()+1 var mytoday=today_date.getDate() document.write(myyear+"/"+mymonth+"/"+mytoday) } Opening the original page in my browser displays nothing. Just a blank page. Any help you can give would be greatly appreciated! Geoff Similar TutorialsI have two pages A and B. I have a link in the page A. I have two iframes in the page B. In practice, the link in the page A must open the page B and the link's href must open in the second iframe of the page B. Is there any script that does this? I'm trying to program/modify a simple countdown timer in a .js file. I was able to get it to work when I just loaded the index.html file straight from my computer to my browser but it failed once uploaded. Here was the code for my index.html file. Code: <script type="text/javascript" src="countDown2.js"></script> <body> <b id='itgoeshere'>timer should go here</b> <script language ="Javascript"> window.onload = cd() </script> </body> and here is my code for my .js file Code: var days var hours var mins var secs; function cd() { var today = new Date() var eventDate = new Date(2012,0,28,19,19,70) difference = eventDate.getTime() - today.getTime() days = Math.floor(difference / (1000*60*60*24)) difference = difference - days * (1000*60*60*24) hours = Math.floor(difference / (1000*60*60)) difference = difference - hours * (1000*60*60) mins = Math.floor(difference / (1000*60)) difference = difference - mins * (1000*60) secs = Math.floor(difference / (1000)) redo(); } function dis(days,hours,mins,secs) { var disp; disp = days + ":" + hours + ":" + mins + ":" + secs; return(disp); } function redo() { secs--; if(secs == -1) { secs = 59; mins--; if (mins == -1) { mins = 59; hours--; if (hours == -1){ hours = 23; days--;}} } document.getElementById('itgoeshere').innerHTML = dis(days,hours,mins,secs); if((days == 0) && (hours == 0) && (mins == 0) && (secs == 0)) { window.alert("Chris is running."); // change timeout message as required } else { cd = setTimeout("redo()",1000); } } function init() { cd(); } window.onload = init; If I were to just cut and paste my .js code between my <script> it works but I was hopping to use it over again on multiple pages and having only one file to update. Also I'm very new at programming in general so if you see an obvious mistake not related to my question please let me know. I need help turning the following inline code: Code: <a href="http://www.bing.com/" name="bing" onclick="return !window.open(this.href)">Bing</a><br> <a href="http://www.lycos.com/" name="lycos" onclick="return !window.open(this.href)">Lycos</a><br> <a href="http://www.dogpile.com/" name="dogpile" onclick="return !window.open(this.href)">DogPile</a><br> into an external javascript function that will do the same thing (open all links in a new window individually if javascript is enabled, without destroying links in html for if javascript is not enabled). Any smarties out there have any good suggestions? Hey guys. So right now I'm able to execute javascript code on my website without the use of <script> tags. Example: <body onload=alert("cool");></body> What I want to be able to do is insert an external javascript file located at another website using JavaScript code (not script tags). How can this be done? Thanks I have an external Javascript file that only works when I put: Code: <script type="text/javascript" src="external.js"></script> at the end of the HTML page. Does anyone know why it won't work in the head of the page? Thanks Hi I need to develop a simple keyword search in external html files(having traversing in directories ability). Is this possible? (in this case php can be used) Please guide me Thanks Hi there, I am trying to open some SWF videos from an HTML page. When the user clicks the link, I would like to have the videos open in a transparent window (not a separate browser wndow). I have figured out how to embed the files and have them open in a transparent window as soon as you load/refresh the page but I want to open the SWF using a link. Any suggestions? Thank you all. B Hi, I want to restrict opening my popup window if it is already opened. For simple scenario, it is quite possible to do but in my case -- 1) When parent page is opening popup window, it is getting refreshed (required from client for some reason). 2) Once submit button is clicked from popup window, again parent page is getting refreshed (again its a requirement from client side). With these 2 conditions, I lost my saved value from variable and hence new popup is keep coming when the action is same. Currently I am using below code to open popup [CODE] function OpenWindow() { if(winPop && !winPop.closed) { alert("Popup is already open"); } else { winPop = window.open('MyPopupPage.aspx'); } } [CODE] Please help me to get rid of this problem. Thanks in advance. - Bhasker Hi, I hav linked external js (ext1.js) to my app.html page. Now in the ext1.js, I have a function like [CODE] function onwindowload(){ //Access HTML element and append external js 2 (ext2.js) here }[CODE] //Access HTML element and append external js 2 (ext2.js) here--->I donno how to add external JS here. Even if i add the external JS here, the JS uses document.write fn. which replaces entire page. Please suggest a solution I do write some php, but have not much idea about JavaScript. I use window.open to open 10 pages simultaneously. I prefer to open them with a time delay from each other to put less load on the target server. This is my code with no delay. (I played around with setTimeout but can't get it to work.) PHP Code: <a href='http://www.".$new[9]."' onclick="window.open('http://www.".$new[0]."/'); window.open('http://www.".$new[1]."/'); window.open('http://www.".$new[2]."/'); window.open('http://www.".$new[3]."/'); window.open('http://www.".$new[4]."/'); window.open('http://www.".$new[5]."/'); window.open('http://www.".$new[6]."/'); window.open('http://www.".$new[7]."/'); window.open('http://www.".$new[8]."/')\" target='new300/'>Open 10</a> window.open() doesn't open an entirely new window in FF3.6, just a new tab suggestions? Edit: Yeah, ok, so if i specify a size smaller than the current standard window, it'll be forced to open a new window. but what if i want a new standard sized window to open entirely? and in any case, i wan t amore direct solution where possible, thanks. hi , how to load external page into div without template . Example : I have external page using CSS & html : <div id="header"></div> <div id="content1"></div> <div id="content2"></div> <div id="content3"></div> <div id="sidebar"></div> <div id="sidebar1"></div> <div id="footer"></div> NOTE : all javascript code load external page with all template code into div ! how to load ONLY content2 into DIV . thanks Dear Forum, I have a website of quite a few pages which also has a style sheet switcher so the user can select their own customised graphics and layout (css file) these css files load in the graphics but only when the call is clicked... even if the page has already been opened for seconds or minutes when the graphics could have been loaded in for an instant switch. so i implemented the following code: Code: <SCRIPT language="javascript"> function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } </SCRIPT> <body onLoad="MM_preloadImages('/corporate/heading.png','/creative/heading.png','/earth/heading.png','/under-the-sea/heading.png','/space-and-stars/heading.png','/classical/heading.png','/corporate/document.jpg','/space-and-stars/document.png','/creative/document.jpg','/earth/background.jpg','/under-the-sea/background.jpg','/classical/document.png','/classical/background.jpg','/under-the-sea/document.png','/corporate/home-graphics.png','/earth/content.jpg','/earth/footer.jpg','/earth/home-graphics.png','/under-the-sea/home-graphics.png','/creative/home-graphics.png','/space-and-stars/background.jpg','');"> it works fantastically - you open the page and as long as it takes to notice where you can click the styles is the same amount of time it takes to have the styles cached for the styles switch immediately and effortlessly. however, the site has grown and is now quite a number of pages with the above in each html file. ive just added a "creative 2" style, which has caused the above to need updating........ the maintenance of this code is inefficient to edit each page. would someone be able to point or show me how to, in principle: Code: <body onLoad="MM_preloadImages('/styles-code.js);"> styles-code.js?? page: '/corporate/heading.png', '/creative/heading.png', '/earth/heading.png', '/sea/heading.png', '/classical/heading.png', '/corporate/background.jpg', '/creative/background.jpg', '/earth/background.jpg', '/sea/background.jpg', '/classical/background.jpg', etc and have 1 page of this code called in by all pages in an easy to see and edit list? would really appreciate guidance with this, Hi, I'm new to JavaScript and I'm having a bit of trouble understanding something that seems relatively simple. When I make changes to CSS in JavaScript using '.style' I'm changing the attribute values of inline CSS. Can I use JavaScript to change the attribute values of rules in an external CSS file? I have no CSS in my html and would like to know if I can grab the values of attributes in an external CSS file using JavaScript. Thank you. I've been playing with this workarouns for literally years, but I'm getting fed up with it. Can anyone here suggest a better way of dealing with the following conundrum - or at least clarify why it occurs? When I have an external stylesheet I can't access the properties assigned therein. I'll give an example - HTML/CSS/JS are all inseperate files - but everything is called into the HTML as you can see. HTML: Code: <head> <script type="text/javascript" src="js.js"></script> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="box" onclick="showWidth()"></div> <body> CSS (style.css) Code: #box { width: 200px; } Javascript (js.js) Code: function showWidth(){ var box = document.getElementById('box'); alert(box.style.width); } Now the alert fired by showWidth() is empty - meaning that javascript can't see the width of the div element 'box' Now, if I assign width as part of the style attribute of the div javascript thus: HTML: Code: <head> <script type="text/javascript" src="js.js"></script> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="box" onclick="showWidth()" style="width: 200px;"></div> <body> javascript can see this and the alert fired by showWidth() shows '200px'. So, I have two questions: 1. Why? 2. Is there a way of accessing these external style elements without having to define styles inline all the time? Cheers! Mike Hello, I'm sorry if this has been asked before but I've been googling and looking in reference books for the last couple of days and just haven't been able to find an answer. I'm new to javascript and have just completed my first fully working script to crossfade images and have clickable links to go to a specific image, the code works perfectly when the code is inside of the html document with the elements but when you remove the javascript and put it in a seperate file its unable to get the value of the elements from the html. Is there a way to do this, give the document a alternative src to look in for the elements or something? An example below. Javascript snipit [CODE] imageId = "mainImage"; image = window.document.getElementById(imageId); alert(image); [CODE] image returns null. what I want it to return is the value fro the HTMl document that this file is included in. [CODE] <script type="text/javascript" src="fadeFunctions.js"> </script> </head> <body> <div id="imgHolder" style="position: absolute; top: 200px;"> <div id="topImage" style="position: absolute; top: 0px; left: 0px; z-index: 100;"><img id="mainImg" src="1.png" /></div> [CODE] Thanks for any help or suggestions that you can give. Hey all, I'm fairly new to JavaScript. I learned PHP and now I'm creating a user registration and login system for an application I'm making and I decided I wanted to give JS a try. I'm trying to make a form validation function that will be called when I press the submit button on the form but I want to use an external js file to store all my custom functions. I have the OnClick event in the button with the call to my function inside of that. But where and how on the page to I reference my external file so that the button can call the function? Thanks guys! <body> <script type="text/javascript" src="/khk.php?klub=khk&user=w"></script> This script works fine, but I get a error: line: 2 character: 1 error: character illegal code: 0 url .... Can anybody help?? Code: <!-- Add-in device.js files are placed here --> <div id="deviceScript"></div> What I have been doing is clearing this out when I select a new (add-in) device and append a script tag with its .src file. I have some vague idea that unhooking an external js file might remove its code from memory. If not is there a way to do so? Functions in different script files have the same name - for example, I use start() to set up each device. It seems that the latest device start() overwrites the one in memory - but I am not sure if overwrite means delete last one or whether there is some horrendous build up of dross going on. Any clarification appreciated. Hi, I need some help with a bit of a challenge. I need to allow users to spesify a file stored on their hard drive, read the file and populate a table and eventually a database. I can probably upload the file using <input type='file'> but what then? How do I access the file after this, or is there a better way? Using XMLHTTP gives 'access denied.....' I can not use PHP as the site does not support PHP. For those who know the environment - it's a QuickBase application I need to upload to....... Thanks Nic |