JavaScript - :confused:capturing Url In Address Bar Before Refresh
My client has a training site that is associated with 4 different domains. If a user navigates away from one of the domains to another site (for instance www.google.com) they want to display a message and ask them if they want to leave the training site. my understanding of the window.location.href is that it will capture what is typed into the address bar until the request is submitted to the server but by then they are leaving the site. below is my code on the onbeforeunload event.
conceptually: i want to capture the URL, compare the hostname and if the host name is one of the 4 domains then allow them to proceed, if it is not then as them if they want to leave the site. if they click ok allow them to move forward, if the click cancel then reload the page. I know this is considered bad design and i have expressed this but this how they want the site to behave. thanks ________________________________________________________________ [CODE] <script type="text/javascript"> function SiteCheck() { var strCurrentURL = window.location.href; var strNewHostName = strCurrentURL.split("/"); // for(i = 0; i < strNewHostName.length; i++) { alert(i + ' ' + strNewHostName[i]); } //strNewHostName[4] = "sddmtraining.org"; //test values //strNewHostName[4] == 'sddmtrain.org'; //test values //strNewHostName[4] == 'www.sddmtrain.web.org'; test values if (strNewHostName[4] == 'sddmtraining.org' || strNewHostName[4] == 'sddmtrain.org' || strNewHostName[4] == 'www.sddmtrain.web.org') ; else { var r = confirm("Are you sure you want leave the Training Site - Click Ok to Leave / Click Cancel to stay"); if (r==true) ; else { window.location.reload(window.location.href ); } } } </script> [\CODE] Similar TutorialsI am using a third party shopping cart service written in php. I don't have access to the php code so I decided to use javascript to write a cookie. What I'm trying to do is have the cookie capture the referring URL and then keep it for a day and have it follow where ever the visitor goes in the shopping cart. Then when they check out, the referring URL will populate a form field and be returned as part of the form results. This way I can track where my visitors come from. My code is below and I'm adding it to the file designated as the head section. (The files I have access to must use some form of include but I can't use php in them - just html and javascript. I've tried.) I have an alert in the code that suggests something to do as well as set the cookie. The alert comes up and the cookie is set but when you go to another page, the alert comes up again and another cookie is set. I just need to have it set once so when they fill out the order form, I'll know where they came from. This is my code and thanks for the help. Code: <SCRIPT LANGUAGE="JavaScript"> cookie_name = "dataCookie"; var referred; function getName() { if(document.cookie) { index = document.cookie.indexOf(cookie_name); if (index != -1) { namestart = (document.cookie.indexOf("=", index) + 1); nameend = document.cookie.indexOf(";", index); if (nameend == -1) {nameend = document.cookie.length;} referred = document.cookie.substring(namestart, nameend); return referred; } } } referred=getName(); if (referred == "dataCookie") {referred = "No-Referral"} function getCookie(c_name) { if (document.cookie.length>0) { c_start=document.cookie.indexOf(c_name + "=") if (c_start!=-1) { c_start=c_start + c_name.length+1 c_end=document.cookie.indexOf(";",c_start) if (c_end==-1) c_end=document.cookie.length return unescape(document.cookie.substring(c_start,c_end)) } } return "" } function setCookie(c_name,value,expiredays) { var exdate=new Date() exdate.setDate(exdate.getDate()+expiredays) document.cookie=c_name+ "=" + escape(value) + ((expiredays==null) ? "" : "; expires="+exdate.toGMTString()) } function checkCookie() { { var cookieEnabled=(navigator.cookieenabled)? true : false //if not IE4+ nor NS6+ if (typeof navigator.cookieenabled=="undefined" &&!cookieEnabled) { document.cookie="testcookie" cookieEnabled=(document.cookie.indexOf("testcookie")!=-1)? true : false } if (cookieEnabled) { var todaysdate = new Date() var day = todaysdate.getDay() switch (day) { case 1: day = "Monday" break case 2: day = "Tuesday" break case 3: day = "Wednesday" break case 4: day = "Thursday" break case 5: day = "Friday" break case 6: day = "Saturday" break case 0: day = "Sunday" break } var thedate = getCookie('thedate') if (thedate != null && thedate != "") { if (day == thedate) {} else {alert('Be sure to subscribe to our newsletter.')} } else { thedate = day if (thedate!=null && thedate!="") { { cookie_name = "dataCookie"; var referred; if(document.cookie != document.cookie) {index = document.cookie.indexOf(cookie_name);} else { index = -1;} if (index == -1) { referred=document.referrer; document.cookie=cookie_name+"="+referred; } } {setCookie('thedate', thedate, 365)} alert('Be sure to subscribe to our newsletter.') } } } else {alert('Please Enable Cookies. This site uses Cookies during your visit.')} } } 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() { checkCookie(); }); //--> </script> In the body I am reading it with a form field of Code: <SCRIPT LANGUAGE="javascript"> document.write("<FORM>") document.write("Originally Referred by:") document.write("<INPUT id='cookiealert' TYPE=text style='width:300px' VALUE=" +referred+ ">"); document.write("</FORM>") </SCRIPT> Is it possible to capture function calls? for example: alert('hello world'); is there a way to capture this function call. Why do i want to do this: 1. i need a way to test if a function exist before it is called, so i dont get undefined errors etc. 2. try/catch only works on sections of code, i need a global solutions.(can i capture functions calls on remotely loaded scripts, like google analytics etc ) Hello experts, My first question folks. I have recently joined a web based video conference which allow people to join as a guest (no need to create account). This conference's interface and function is written in javascript as an applet. To cut the long story short, is it possible to capture this applet and see the conference (without having to join the conference)? What happen at the moment is people wont be able to see the conference without join in and therefore take one slot out of 7 seats if you like. When all slots are taken people can not see the event. I was wondering if there is a way to capture this event using other javascript. I have all the scripts required to make this conference running, i know the logic of how javascript works but i dont know what is what in detail. Can anyone suggest anything? Thanks. Hello I need help regarding capturing page events(mouse click ,navigation) etc on web pages and write them into a text file (using javascript). One way is using javascript events and writing them into text file. Is there be a better way of doing this ?? Hi, I have the below code: Code: <script type="text/javascript"> function loadQuickMessageCheck(File,ID){ var xmlhttp; 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; eucalyptus = setInterval(function(){loadQuickMessageCheck(File,ID)},20000); } } xmlhttp.open("POST",File,true); xmlhttp.send(); } </script> But I am overloading the server and crashing it. I've googled the issue and have found people with similar problems who talk about the need to cancel the last refresh request before they send the next refresh. I even found this nice piece of code which worked for someone else. Quote: try{window.clearTimeout(tRefresh)} catch(err) {} tRefresh = setInterval(setContext, varInterval*60*1000); } I am not sure if this is the solution that I am looking for but if it is all my attempts at applying this code has been a bit of a disaster. Codes for Dropdown menu based on radio buttons selection needed!? I need urgent help with this: I need codes for a dropdown menu that is altered by radio buttons. I want to insert the value selected from the dropdown menu into a table. My problem is the following. I have an editable <div>: <div class='edit' id='divContent' name='divContent' ContentEditable>some text</div> If I press 'enter' two lines are skipped. I know that if I press 'shift+enter' only one line will be skipped. If I check the unformatted code of the contenteditable div, 'enter' gives me <p> and 'shift+enter' gives me <br>, which makes sense because <p> is formatted differently than <br>. So I want to change 'enter' into 'shift+enter' I have already found something to capture and kill 'return' function killReturn() { key = event.keyCode; if (key == 13) return false; } But now for some means to replace the killed 'enter' with 'shift+enter'? Thanks a lot in advance for any advise! Hey i got this code and i looked at it and im so lost i cant describe it can someone hep me in understanding the ins and outs of this. Code: var YOOaccordion=new Class({initialize:function(togglers,elements,options){this.setOptions({open:'first',allowMultipleOpen:false,fade:false,fadeDuration:600,transition:Fx.Transitions.linear,duration:400},options);this.togglers=togglers;this.elements=elements;this.elementFx=[];this.elementVisible=[];this.togglers.each(function(tog,i){tog.addEvent('click',function(){this.toggleSection(i)}.bind(this))},this);this.elements.each(function(el,i){this.elementFx[i]=new Fx.Slide(el,this.options);if(!(this.options.allowMultipleOpen&&this.options.open=='all'))this.hide(i)},this);if(this.options.open=='first')(function(){this.slideIn(0)}).delay(1,this)},toggleSection:function(iToToggle){if(!this.options.allowMultipleOpen){this.elements.each(function(el,i){if(this.elementVisible[i]&&i!=iToToggle)this.slideOut(i)},this)}this.toggle(iToToggle)},toggle:function(i){this.elementFx[i].toggle().chain(function(){this.elementVisible[i]=(this.elementVisible[i]+1)%2}.bind(this));if(this.options.fade)this.fade(i)},slideIn:function(i){this.elementFx[i].slideIn().chain(function(){this.elementVisible[i]=1}.bind(this));if(this.options.fade)this.fade(i)},slideOut:function(i){this.elementFx[i].slideOut().chain(function(){this.elementVisible[i]=0}.bind(this));if(this.options.fade)this.fade(i)},show:function(i){this.elementVisible[i]=1;this.elementFx[i].show()},hide:function(i){this.elementVisible[i]=0;this.elementFx[i].hide()},fade:function(i){var fx=new Fx.Styles(this.elements[i],{'duration':this.options.fadeDuration,'wait':false});fx.start({'opacity':[this.elementVisible[i],(this.elementVisible[i]+1)%2]})}});YOOaccordion.implement(new Options); var n = 123456.789; n.toFixed(0); just starting out JavaScript. So i type the above code in firebug. it returns this result:- "123457" As for as i know, toFixed() converts a number to a string with a specified number of digits after the decimal point. If i have specified 0, which i'm assuming it means 0 digits after the decimal point, why does the 7 appear and the 6 is taken out. really fustrating and can't seem to get my head over it. First let me say, I do know how to code I just haven't for a VERY long time and things are slow to come back. That being said, I'm working on a self induced project to bring back my coding abilities and I'm stuck. What I'm wanting to happen is when a certain link is clicked it goes to a certain photo album and pulls random pics just from that album and displays them in a certain place on that page. What would be the best way to approach this to make it happen? I'm not wanting someone to do this for me, just get me going in the right direction. Thanks.... I trying to display a random number using innerHTML Here's my code: Code: <html> <head> <script language="JavaScript"> var myArray = new Array("String1", "String2", "String3", "String4", "String5", "String6", "String7", "String8", "String9", "String10"); var num = Math.floor(myArray.length * Math.random()); document.writeln(myArray[num]); //document.getElementById("myString").innerHTML = myArray[num]; </script> </head> <body> <div id="myString"></div> </body> </html> it works when I use document.writeln(myArray[num]); but does NOT work for document.getElementById("myString").innerHTML = myArray[num]; any ideas?? tks The situation: I have a javascript scroller that loads it's data via JQuery .load function (code not listed as it is not relevant to the problem.) The amount of data loaded is greater than what is shown (each piece of data in it's own div with id's from #scroller1 to #scroller20). So you can see the first 13 div's right away and the other 7 are scrolled in 1 by one as the first 7 are scrolled out 1 by 1 in an endless and consecutive loop. The problem: For some reason, after div20 (#scroller20) is scrolled in to view, my scroller removes div8 but does not add div1 creating a blank space below div9 (if this confuses you, take a look at the link at the bottom of this post.) After div20 is removed, then div13 is added but div1 is NOT removed, now filling this blank space. Now normally this is not visible to be a problem, except that each of these div's will end up being much higher, perhaps only 4 showing at a time, so when one of these 4 disappears, then reappears, it will become unacceptable. Why is this happening? I am sure it has to the code/math inside of function divage... but I can't figure it out for some reason... please help. Here is my javascript code (which uses JQuery) Code: var slide = 1; var auto_scroll = setInterval("scrollme(slide++)", 4000); function scrollme(i){ divage(i); } function divage(i){ removeIt(i%21); addIt((i+13)%21); var j=((i-1)%21); $('#scroller-main-text').prepend($("#scroller"+j)); } function addIt(i){ $("#scroller"+i).fadeIn(1000); } function removeIt(i){ $("#scroller"+i).fadeOut(500); } URL where the problem can be witnessed: http://www.inspiritandintruth.com Hi - In am learning Javascript and trying to understand why, the following line : Code: arguments.callee.superclass cannot be replaced by : Code: this.constructor.superclass In the following code sample : ( the explanation given is that if someone creates a subclass of PositionedRectangle, then this.constructor will refer to the new subclass constructor, not to PositionedRectangle - but why? 'this' here to my knowledge represents the object 'PositionRectangle' and if not I can't understand why not. ) Code: // Here is a simple Rectangle class. // It has a width and height and can compute its own area function Rectangle(w, h) { this.width = w; this.height = h; } Rectangle.prototype.area = function( ) { return this.width * this.height; } // Here is how we might subclass it function PositionedRectangle(x, y, w, h) { // First, invoke the superclass constructor on the new object // so that it can initialize the width and height. // We use the call method so that we invoke the constructor as a // method of the object to be initialized. // This is called constructor chaining. PositionRectangle.superclass = Rectangle; arguments.callee.superclass .call(this, w, h); // Now store the position of the upper-left corner of the rectangle this.x = x; this.y = y; } // Create a prototype for the subclass that inherits from the prototype // of the superclass. function heir(p) { function f(){} f.prototype = p; return new f(); } PositionRectangle.prototype = heir(Rectangle.prototype); PositionRectangle.prototype.constructor = PositionRectangle; I'm picking up some work on a site that has been built already in joomla! On some of the pages IE is breaking it and pushing it down to the bottom. example:LINK TO BREAKAGE That Volleyball tag should be up next to the picture. And there is an entire paragraph underneath that that is not getting seen. Someone told me at first that it was the javascript, and I thought it was the Rokbox plugin, but that's not even activated. I am so confused. And it's not the css, because I tried that. Has anyone else experienced this problem? And how is it fixed? I have been working on it all weekend! Thank you for all comments! For a project in my high school web design class, I need to integrate an Excel spreadsheet as data so to speak for a web page. I want to pull the prices from the sheet, and make them appear on the page. I'd like to pull it from the sheet so that the client can still adjust and edit the prices without having to reach the actual webpage. Conceptually, I thought this would be fairly straight forward, but in researching how to do this, I got very confused. I'm not even positive that I'm putting this in the right section. So my main question is this: Is there a way to integrate an Excel spreadsheet in such a way that it can provide data for certain fields of a webpage? If so, can someone please explain how? Thanks, A Confused High School Girl Hi there coding friends, im stuck again this time on arrays.. Im trying to get my head around it and im sure it's one of those things you do once you know what your doing (to an extent) now the problem is... i have 2 arrays for a experiment one = flowerheight and the other is flowernumbers. now the height is set out as 15,16,17,18,19 and numbers 2,1,6,4,2 what the aim is in the first part is to times the height by numbers of the corresponding array ie. 15x2 16x1 17x6 18x4 19x2 to make a 3rd array with them as the totals then the second part of the program is to calculate the average height i.e total of total of numbers array (2+1+6+4+2) + total of 3rd array(15x2+16x1+17x6+18x4+19x2) then a write to show what the total was.. now all I have of the code is... Code: <HTML> <HEAD> <TITLE> Flower Experiment </TITLE> <SCRIPT LANGUAGE = "JavaScript"> /* * Program to calculate average height of flowers.. */ //Experiment results var flowerHeights = [15,16,17,18,19]; var flowerNumbers = [2,1,6,4,2]; //Write code to work out and show flowerheightxnumbers. //Write code to calculate the average height of the flowers (total of flowernumbers + (flowerheight X numbers) and write it out in the browser window. </SCRIPT> </HEAD> <BODY> </BODY> </HTML> now I have no idea how to go about this it's making me loose my mind. Can someone start me off in the right directon and/or explain to me what to do. Anyhelp much appreciated, I wish I could have done more to the question to make it easier for you lot to help me but my brain is frazzled Thanks. James Hi, thanks for reading this. I have two templates that I use on my website that use font faces.....(both of these templates were free downloads). However, if I look at the files for each of these templates, they use font face differently - can someone kindly check if they are ok? Is one wrong and one right? Template 1: Which works 100% well in all browsers There is NO css reference, rather, each page has this javascript: <script type="text/javascript" src="../jsfunnels/cufon-yui.js"></script> <script type="text/javascript" src="../jsfunnels/MgOpen_Moderna_700.font.js"></script> <script type="text/javascript" src="../jsfunnels/Chunk_400.font.js"></script> <!-- Start Video section --> <script type="text/javascript"> Cufon.replace('h1', { fontFamily: 'Chunk' }); Cufon.replace('h2', { fontFamily: 'Chunk' }); Cufon.replace('h3', { fontFamily: 'Chunk' }); Cufon.replace('h7', { fontFamily: 'Chunk' }); Cufon.replace('h4', { fontFamily: 'MgOpen Moderna' }); Cufon.replace('h6', { fontFamily: 'MgOpen Moderna' }); </script> Template 2: Which works 70% well in all browsers <script type="text/javascript" src="js/cufon-yui.js"></script> <script type="text/javascript" src="js/TitilliumMaps26L_500.font.js"></script> <script type="text/javascript" src="js/TitilliumMaps26L_300.font.js"></script> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/scripts.js"></script> <script type="text/javascript"> Cufon.replace('.footer span','.footer span a',{ fontFamily: 'TitilliumMaps26L-250wt'}); Cufon.replace('.col-left p',{ fontFamily: 'TitilliumMaps26L-250wt'}); Cufon.replace('.reg a',{ fontFamily: 'TitilliumMaps26L-250wt'}); Cufon.replace('.content4-left p',{ fontFamily: 'TitilliumMaps26L-250wt'}); Cufon.replace('.content4-right p.title',{ fontFamily: 'TitilliumMaps26L-250wt'}); Cufon.replace('.header-right','.search span','.header-right ul li a',{ fontFamily: 'TitilliumMaps26L-500wt'}); Cufon.replace('h1',{ fontFamily: 'TitilliumMaps26L-500wt'}); </script> And the CSS which I believe is the culprit is he @font-face { font-family: 'TitilliumMaps26L002'; src: local('../font/TitilliumMaps26L002-250wt') url('../font/TitilliumMaps26L002.otf') format('opentype'); } ------------------ Now, according to Paul Irish article, I should NOT make the above CSS a local path - see the red font above. So I guess my questions are, can anyone see anything wrong with the above, and why is there a different approach, i.e. one uses css and the other doesn't? THANKS VERY MUCH I use console.log to print the dom element info, but some results make me very confused.The code is below, you can paste it to a file and browse it. //********************** <html> <head> </head> <body> <script type="text/javascript"> function showObjInPage(obj) { document.write("=======================================<br/>"); document.write((typeof obj) + "<br/>"); document.write("length: " + obj.length + "<br/>"); ///!!! 0, may ok document.write(obj); //!!!!!write nothing for (var prop in obj) { document.write(prop + " = " + obj[prop] + "<br/>"); } document.write("=======================================<br/>"); } function consoleLog(obj) { console.log("=======================================<br/>"); console.log((typeof obj) + "<br/>"); console.log("length: " + obj.length + "<br/>"); //!!!!! this is the confuse, it is 0, but the code below show obj correct! console.log(obj); //!!! write all the p elements for (var prop in obj) { console.log(prop + " = " + obj[prop] + "<br/>"); } console.log("=======================================<br/>"); } var elems = document.getElementsByTagName('p'); //console.log(elems); //console.log(elems.length); showObjInPage(elems); consoleLog(elems); </script> <p>p1</p> <p>p2</p> <p>p3</p> <p>p4</p> </body> </html> I want to print the p elements info use console.log, it is ok to log the elems, but the elems's length is 0, so it is not consistent! Maybe my code need to write after the 'p' element, but the problem is very confused. Is it a chrome console.log bug or just I do something wrong? hello everybody how can I set url in the address without opening the url , just placing ??? i.e : to open a url we use this PHP Code: document.location = 'http://www.codingforums.com/' I wanna show the user that the url is changing in the address bar as typing after it reached the end it will opens the url I don't care for the method of writing the new url in the address bar such as typing or sliding ... etc please tell me how to do this thanks |