JavaScript - Javascript Body Onload And Windows.onload Event Probelm With Firefox
Hello
Can anyone help with the following problem On the following page http://www.stroudskittles.co.uk/signingon.html I have a Body onload event (to load the chained Menu) and a windows.onload event (to load the IFrame Ticker) If I open the page in Internet explorer both scripts function; however in Firefox I'm having problems. The Chained Menu works, however the IFrame Ticker does not display. Both events ahave ben placed on the boady tag. Can anyone advise how I can get both to display in Firefox Can anyone Similar TutorialsI have the following javascript function: [ function addNewWindowEvent(evType, fn) { if (window.addEventListener) { this.addEventListener("load", fn, false); return true; } else if (window.attachEvent) { var onload = "onload" this.attachEvent(onload, fn); return true; } else { return false; } } ] which is giving me a an exception every time a page on our site loads. The actual exception in firefox is this: uncaught exception: [Exception... "Could not convert JavaScript argument" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: https://cms-dev.stchas.edu/global/js/hdvscripts.js :: addNewWindowEvent :: line 5" data: no] and I'm not sure exactly what it's complaining about. I'm relatively new to javascript so diagnosing and fixing this problem has me quite puzzled, and so far I have been unable to find anything helpful when I try and google for information on this. I would appreciate any help or suggestions. Thanks. henryv hi guys, how can i get this code to load on body onload? without fading in and out? Code: <html> <head> <!-- For ease i'm just using a JQuery version hosted by JQuery- you can download any version and link to it locally --> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function() { $("#responsecontainer").load("response.php"); var refreshId = setInterval(function() { $("#responsecontainer").load('response.php?randval='+ Math.random()); }, 9000); $.ajaxSetup({ cache: false }); }); </script> </head> <body> <div id="responsecontainer"> </div> </body> Thanks What I mean is that my <body> tag currently is like this: Code: <body class="page-course"> I would like to insert a pop-up contact form which requires the body tag to be like this: Code: <body onload="javascript:fg_hideform('fg_formContainer','fg_backgroundpopup');"> Not quite sure how to merge these - indeed can I merge them? Perhaps better to make the body class (top example) execute elsewhere? THANKS!! Hi, Is there any alternative to the ' body onload="" ' function? I have on the page several scripts running and one is blocking the others because of the body onload function. It is working if I change that to body onfocus but it is loading the content all over when the user gets back to the page. Any ideas how can I avoid this? I can't apply onload to some element, onfocus is not working and this code also does not suite me: Code: <script type="text/javascript> function(); </script> Thanks in any case! Batric I found a little chat script online and I wanted to check it out. When I integrated it into a page I created, for some reason this will not work correctly <body onload="setInterval('chat.update()', 1000)"> I tested it with two different browswers open Lets say on two different browser windows you have user1 and user2 if user1 types 'Hello' it will not show up on user2 window but if user2 types 'Hi' then on user2 window it will say user1 says Hello user2 says Hi so basically for user1 to see what user2 has wrote, user1 has to type something first and send it to see what user2 said. hope you understand, if you would like I could post up the code. i cannot understand, am i making the same mistake each time but my <body onload="startChecking()"> does not want to load again?? here my full code: Code: <head> <script language="JavaScript" type="text/javascript"> var sendReq; var receiveReq; var lastmessage = 0; var mTimer; function startChecking() { receiveReq = new XMLHttpRequest(); console.log("1234"); getNewMessage(); } function getNewMessage() { if (receiveReq.readyState == 4 || receiveReq.readyState == 0) { console.log(receiveReq.readyState); } mTimer = setTimeout('getNewMessage();',30000); } </script> </head> <body onload="startChecking()"> //more code here </body> i just want the console.logs to execute then i will continue with the rest of my code... please help? thank you I am a novice with Javascript and need help. The homepage of the website I am developing includes a simple javascript slideshow. The code for the script came from a different site that allowed code sharing. It functions wonderfully once loaded. However, in Internet Explorer, I must control-click to allow for the script to run. This wouldn't be a huge problem, but it is an inconvenience to visitors of the site. Since the website is for a public high school, the district computers have a high security setting. Therefore, anyone trying to access the site from a school computer (the main clientele) will have to control-click and allow access everytime they wish to visit the site. Not ideal. I know my problem is that I am using <body onload="runSlideShow">. I have tried including the defer attribute, but that did not work. Is there any other way I can write the code to not cause viewers to control-click everytime the page is loaded? Thanks tons! EDIT---- When opened in IE 7, there is a bar that warns againsts scripts and activex. I understand that I can lower my personal security setting, but I don't have the authority to do so for district PCs. Once a user clicks to allow the script the slideshow begins automatically. So, how can I write the code so that the warning bar does not show up? ---- Here's the bit of code that is applicable. Code: <script language="JavaScript"> var slideShowSpeed = 4000; var crossFadeDuration = 4; var Pic = new Array(); Pic[0] = 'field.jpg' Pic[1] = 'mural3.jpg' Pic[2] = 'cheer1.jpg' Pic[3] = 'Nuncrackers.jpg' Pic[4] = 'soccer4.jpg' Pic[5] = 'radio4.jpg' var t; var j = 0; var p = Pic.length; var preLoad = new Array(); for (i = 0; i < p; i++) { preLoad[i] = new Image(); preLoad[i].src = Pic[i]; } function runSlideShow() { if (document.all) { document.images.SlideShow.style.filter="blendTrans(duration=2)"; document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"; document.images.SlideShow.filters.blendTrans.Apply(); } document.images.SlideShow.src = preLoad[j].src; if (document.all) { document.images.SlideShow.filters.blendTrans.Play(); } j = j + 1; if (j > (p - 1)) j = 0; t = setTimeout('runSlideShow()', slideShowSpeed); } </script> <body onload="runSlideShow()"> <img src="field.jpg" name='SlideShow' width="814" height="300" /> Hi guys. I have a quick question. What's the code for having a link with the id "autoid" clicked when the body of my html code loads? Thanks, Alex Hey guys I am having trouble loading a drop down menu list script that I got from Dynamic Drive. Here's the original test page. (Works Fine) <html> <head> <script language="javascript" src="http://www.modbargains.com/images/Javascript/ChainSel/chainedmenu.js"> </script> <script language="javascript" src="http://www.modbargains.com/images/Javascript/ChainSel/MBVehicleChainSelect.js"></script> </head> <body onLoad="initListGroup('Vehicles', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, 'savestate')"> <form name="listmenu0"> <table align="center"> <tr> <td><select name="firstlevel" style="width:160px;"></select></td> </tr> <tr> <td><select name="secondlevel" style="width:160px;"></select></td> </tr> <tr> <td><select name="thirdlevel" style="width:160px;"></select></td> </tr> <tr> <td><input type="button" value="Go" onClick="goListGroup(document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel)"> <input type="button" value="Reset" onClick="resetListGroup('Vehicles')"> </tr> </table> </form> </body> </html> HOWEVER! The site I am working on (which is on a different server) does not allow me to alternate the body tag. Is there an alternative way of doing a body onLoad without actually alternating the body tag? I read that you could do a function onload using javascript, so I tried using this: <script language="javascript" > window.onload = initListGroup('Vehicles', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, 'savestate'); </script> I am not sure if the function is correct but it does not work. Any ideas how I can make this work???? I am having trouble running multiple windows.onload functions and having trouble how to implement them. I found a couple articles on but couldn't really get them to work. Here are the two functions I'm trying to load: Code: <script type="text/javascript"> //<![CDATA[ window.onload=function(){ //randomize order of contents with DIV class="group1" randomizeContent("group1") randomizeContent("group2") randomizeContent("group3") } //]]> </script> Code: <script type="text/javascript"> function showHideMore(obj) { var contObj = obj.parentNode.getElementsByTagName('div')[0]; var status = (contObj.style.display == 'block')? 'none' : 'block' contObj.style.display = status; <!-- obj.innerHTML = (status == 'block')? 'Show less' : 'Show more'; --> obj.curPic = (obj.curPic == 0)? 1 : 0; obj.style.backgroundImage = 'url("'+plusMinusPics[obj.curPic]+'")'; } window.onload=function(){ plusMinusPics = ['plus.png','minus.png']; oMoreLessSpans = document.getElementById('list1').getElementsByTagName('span'); for(i=0; i < oMoreLessSpans.length; i++){ oMoreLessSpans[i].curPic = 0; oMoreLessSpans[i].style.background = 'url("'+plusMinusPics[oMoreLessSpans[i].curPic]+'") no-repeat 0 50%'; oMoreLessSpans[i].onclick=function(){showHideMore(this);} } } </script> hi all im trying to hide a div on page load, ive used this. Code: <script type="text/javascript"> function hideDiv(){ document.getElementById('sidebar').style.display = "none"; } hideDiv() </script> and this in the body tag Code: <body onload="javascript:hideDiv()"> it works fine hiding the div named sidebar, problem comes when i try to then use an Onclick event to show the hidden div, it just wont show. can this be done? please help if you can this work has to be in soon I have an aspx with javascript, and I used to call a script func whenever the page was loaded. Suddenly it doesn't work. I then tried to simplify things to <body onload="alert('hello');" and no alert is shown, nor do I get any error. How come the onload event doesn't fire? How do I fix it? thanks in advance Greetings! Im new in JS, I have two sets of codes and I searched that JS code will not execute if there is two onload event at the same time. How can I get rid of these here are my codes from http://code.jquery.com/jquery-1.6.3.min.js http://ajax.googleapis.com/ajax/libs.../jquery.min.js Code: else if(c.attachEvent){c.attachEvent("onreadystatechange",B),a.attachEvent("onload",e.ready); and Code: else if(c.attachEvent){c.attachEvent("onreadystatechange",C),a.attachEvent("onload",e.ready); Is it possible to combine the two? any help will be appreciated. Good morning guys. I am new to Javascript and am trying to add some functionality to a website but have come across a problem when trying to utilise two seperate Javascript onloads events. I have a text scroller to display the latest news and I also have a javascript lightbox gallery. Both of these events work perfectly on their own but when I try to include both on one page only one of the events is executed. My code is displayed below: Code: <script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script> <script type="text/javascript" src="js/lightbox.js"></script> <script type="text/javascript" src="js/jquery-1.2.6.pack.js"></script> <script type="text/javascript" src="js/jquery.li-scroller.1.0.js"></script> <script type="text/javascript"> $(function(){ $("ul#news-scroller").liScroll({travelocity: 0.04}); }); </script> </head> <body onload="clickMenu('gallery'); initLightbox()"> If anyone could tell me where my mistake is I would be so grateful. I know it is probably a really obvious mistake but being new to this I am unsure where to start looking. Thanks in advance! Mack If I use a window opener to open a new window, is there a way to detect that the new window is finished loading before carrying out some other directive in the opener window? Can I access the remote window's onload event from the opener window? I need to know that the website has loaded before moving to the next page. something like: remoteWindow.onload = goToPage(url); Is this even possible? Hi, I have a form that I am submitting using JQuery, if I copy and paste the form into my main page, everything works fine. If I try to call the form in a separate page to onload none of the buttons work. Is there away around this? Not sure if providing my script helps or not, but just in case here it: Code: <!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"> <title>Messages</title> <head> <link rel="stylesheet" type="text/css" href="style.css" /> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function (){ $('#submitNewSend, #submitNewSend2, #submitNewSave, #submitNewSave2').click(function(){ var btn = $(this).attr('id'); if(btn == 'submitNewSend'){ file = 'insertMessage.php'; Msg = 'Your message has been sent'; } else if(btn == 'submitNewSend2'){ file = 'insertMessage.php'; Msg = 'Your message has been sent'; } else if (btn == 'submitNewSave'){ file = 'insertSaveMessage.php'; Msg = 'Your message has been saved'; } else if (btn == 'submitNewSave2'){ file = 'insertSaveMessage.php'; Msg = 'Your message has been saved'; } var data = $('#MessageNew').serialize(); $.post (file,data, function(){ alert(Msg); $('#MessageNew').each (function(){ this.reset(); }); }); return false; }); }); </script> <script type="text/javascript"> function loadXMLDoc(File,ID){ if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; } } xmlhttp.open("POST",File,true); xmlhttp.send(); } </script> <head> <body onload="loadXMLDoc('getloadCompose.php','txtHintCompose')"> <br /> <br /> <div id="txtHintCompose"></div> </form> </body> </html> And the getloadCompose.php is: Code: <form action="" method="post" name="MessageNew" id="MessageNew" autocomplete="OFF"> <table id="new" width="60%"> <tr> <th>Compose Message</th> </tr> <tr> <td class="first"> <input type="button" class="button3" name="submitNewSend2" id="submitNewSend2" value="Send"> <input type="button" class="button3" name="submitNewSave2" id="submitNewSave2" value="Save"> <input type="button" class="button3" name="submitNewCancel" value="Cancel" onclick="loadXMLDocRefresh('getloadInbox.php','txtHintMessage')" /> </td> </tr> <tr> <td> <br /> <label class="two"><b>To:</b></label><input type="text" class="input" name="to" id="to" value=""><input type="text" class="input" name="recipient" id="recipient" value="" onkeyup="showHint(this.value, 'getEmailName.php','txtHintEmailTo')" size="70" /><br /><br /> <div id="txtHintEmailTo"></div> </td> </tr> <tr> <td> <label class="two"><b>Subject:</b></label><input type="text" class="input" name="subject" id="subject" value="enter subject" onclick="this.value='';" onfocus="this.select()" onblur="this.value=!this.value?'enter subject':this.value;" size="70" /><br /><br /> </td> </tr> <tr> <td> <label class="two"><b>Message: </b></label><div class="scroll"><textarea rows="10" cols="75" class="input" name="messsage" id="message">Enter Message</textarea></div><br /><br /><br /> </td> </tr> <tr> <td class="first"> <input type="button" class="button3" name="submitNewSend" id="submitNewSend" value="Send"> <input type="button" class="button3" name="submitNewSave" id="submitNewSave" value="Save"> <input type="button" class="button3" name="submitNewCancel" value="Cancel" onclick="loadXMLDocRefresh('getloadInbox.php','txtHintMessage')" /> </td> </tr> </table> </form> I know I have buttons doing the same function,there is an ease of use reason for it. I can put everything on my main page if necessary, but it wouldn't really be doing exactly what I want it to do. Hi CF, I'm a graphic/designer and occasional Actionscript developer making what's turning out to be a rather clumsy transition into Javascript. Be gentle. I'm trying to create a script that will load an external image and test whether it's in my document's "tall" or "wide" formats before placing it in the page. This is easy in IE just using imageObject.width, but Firefox seems to always return a value of 0, no matter what I do (this includes using imageObject.naturalWidth). Refreshing the page suddenly causes the wide mode to activate, but any time before the image is actually placed in the document, FF just won't read the width. I've tried maybe a dozen different scripts, but here's my most recent: Code: function testImage(){ if (defaultImage.naturalWidth > 320){ wideMode = true; } placeImage(); } function loadFirstImage(){ defaultImage.src = "images/myGIF.gif"; defaultImage.onLoad = testImage(); } Any ideas on how to accurately get an image object's width after loading, but before placing it on the page? Any help is much appreciated. Thanks, ~gyz I have an ajax member search form that I'm just about done with but I have a couple of really irritating firefox issues. The first one is the lack of support of the click() method. I added the following but it still doesn't want to work: Code: <script> if(typeof HTMLElement != 'undefined' && !HTMLElement.prototype.click) { HTMLElement.prototype.click = function() { var evt = this.ownerDocument.createEvent('MouseEvents'); evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null); this.dispatchEvent(evt); } } </script> The second issue I'm having is with dependent dropdown selects not hiding in firefox. This seems to be due to the other functions that need to trigger onload and is dependent on what order it's loaded. Here's how I'm handling the onload functions: Code: <script> function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); } } } addLoadEvent(function() { ajaxFunction(document.getElementById('country').value); handleOnChange(country); setupDependencies('cbcheckedadminForm', 'adminForm', 'locationsearch'); handleOnChange2(cb_state); }); </script> I don't have an issue with either of these in chrome. IE is a WHOLE other story, it's all kinds of wonky there. I still need to go through and do some debugging for that. Any quick ideas off hand on these two issues? I'll try and post the full php file in a reply. Hi, I am building a navbar using suckerfish. The company that I am using to host the site places onload="page_init()" in the <body> tag automatically. This kills the suckerfish js. Is there a way to remove this onload="page_init()" using a js, or will it just kill that js also? Hi I am new to javascript and designing websites as a whole. I have been playing around with a drag and drop java script from this site: http://www.redips.net/javascript/dra...table-content/ A switch content setting is currently available to check in a checklist: <input name="drop_option" type="radio" class="checkbox" title="Switch content" onclick="set_drop_option(this)" value="switch"/> I wan it to run without any checklist or button whatsoever just from the page load. I am not sure how I would do this. Any suggestions? Thank you Jonathan |