JavaScript - Javascript To Determine Target Attribute
I have an array of all links on a page (see var wa_links = document.links; below). How do I determine if the target of a link is set to "_blank"? I need to do this because currently with my code below, when a link has target="_blank" it ends up adding the Google Analytics code to the parent window and also opening a new window (so basically the new page opens in both the parent and target window instead of just the target window as expected).
Code: /*Regex list of on-site domains, pipe and backslash delimited. */ var wa_onsiteDomains = /mydomain\.com|my2nddomain\.com|my3rddomain\.com|javascript/i; //Display-friendly domain and path name var wa_displayDomain = location.hostname.replace("www.","").toLowerCase(); var wa_displayPathname = location.pathname.toLowerCase(); /*Used to unobtrusivly add events to objects*/ function unobtrusiveAddEvent (element,event,fn) { var old = (element[event]) ? element[event] : function () {}; element[event] = function () {fn(); old();}; } function wa_crossDomainLink(i) { return function () { var thisLink = decodeURI(wa_links[i]); if (typeof(_gaq) == "object") _gaq.push(['_link', thisLink]); return false; }; } var wa_links = document.links; if ( wa_links ){ for(var i=0; i<wa_links.length; i++) { if( wa_links[i].href.match(wa_onsiteDomains) && !wa_links[i].href.match(location.hostname)){ unobtrusiveAddEvent( wa_links[i], 'onclick' , wa_crossDomainLink(i)); } } } With jquery I could just do something like... Code: if (jQuery(link).attr('target') == "_blank") ...but how do I do this in plain old JavaScript? Thanks! Similar TutorialsHello, I am having some trouble with this Javascript slide show. At the moment when you click on the thumbnails they link to a larger image in a seperate browser page. I would really like to customize it so that the images open up in a smaller window on the same page. I'm sure this is something really simple but as of yet haven't been able to solve this little problem. I'm quite new to webdesign and would really appreciate some help. Thanks Hazel <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Exclusive Ionian</title> <script type="text/javascript"> <!-- var timeout = 500; var closetimer = 0; var ddmenuitem = 0; // open hidden layer function mopen(id) { // cancel close timer mcancelclosetime(); // close old layer if(ddmenuitem) ddmenuitem.style.visibility = 'hidden'; // get new layer and show it ddmenuitem = document.getElementById(id); ddmenuitem.style.visibility = 'visible'; } // close showed layer function mclose() { if(ddmenuitem) ddmenuitem.style.visibility = 'hidden'; } // go close timer function mclosetime() { closetimer = window.setTimeout(mclose, timeout); } // cancel close timer function mcancelclosetime() { if(closetimer) { window.clearTimeout(closetimer); closetimer = null; } } // close layer when click-out document.onclick = mclose; // --> </script> <script> function changeimage(towhat,url, toImg){ if (document.images){ document.getElementById(toImg).src=towhat.src gotolink=url } } function sshow(){ window.location=gotolink } </script> <script language="JavaScript1.1"> var myimages=new Array() var gotolink="#" function preloadimages(){ for (i=0;i<preloadimages.arguments.length;i++){ myimages[i]=new Image() myimages[i].src=preloadimages.arguments[i] } } preloadimages("i/allegra/1.jpg","i/allegra/2.jpg","i/allegra/3.jpg","i/allegra/4.jpg","i/allegra/5.jpg") </script> <style type="text/css"> <!-- #sddm { margin: 0; padding: 0; z-index: 30} #sddm li { margin: 0; padding: 0; list-style: none; float: left; font: 11pt Trebuchet MS} #sddm li a { display: block; margin: 0 1px 0 0; padding: 0px 1px; width: 78px; background: #EDEFED; color: #999999; text-align: center; text-decoration: none} #sddm li a:hover { background: #EDEFED} #sddm div { position: absolute; visibility: hidden; margin: 0; padding: 0; background: #EDEFED; border: 0px solid #EDEFED} #sddm div a { position: relative; display: block; margin: 0; padding: 5px 10px; width: auto; white-space: nowrap; text-align: left; text-decoration: none; background: #EDEFED; color: #999999; font: 11pt Trebuchet MS} #sddm div a:hover { background: #F7CB96; color: #999999} --> </style> <link href="file:///E|/c/rou.css" rel="stylesheet" type="text/css" /> <style type="text/css"> <!-- --> </style> </head> <body> <br /> <table width="900" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#EFEFED"> <tr> <td width="900" bgcolor="#EFEFED"> <div align="center"> <p><a href="javascript:sshow()"><img src="i/allegra/1.jpg" name="targetimage" width="900" height="425" hspace="0" vspace="15" border="0" id="targetimage"><br /> </a> <a href="file:///E|/i/allegra/1.jpg" onmouseover="changeimage(myimages[0],this.href, 'targetimage')"><img src="i/allegra/1s.jpg" width="180" height="85" hspace="0" vspace="0" border="0"></a><a href="file:///E|/i/allegra/2.jpg" onmouseover="changeimage(myimages[1],this.href, 'targetimage')"><img src="i/allegra/2s.jpg" width="180" height="85" hspace="0" vspace="0" border="0" /></a><a href="file:///E|/i/allegra/3.jpg" onmouseover="changeimage(myimages[2],this.href, 'targetimage')"><img src="i/allegra/3s.jpg" width="180" height="85" hspace="0" vspace="0" border="0" /></a><a href="file:///E|/i/allegra/5.jpg" onmouseover="changeimage(myimages[4],this.href, 'targetimage')"><img src="i/allegra/4s.jpg" width="180" height="85" hspace="0" vspace="0" border="0"></a><a href="file:///E|/i/allegra/4.jpg" onmouseover="changeimage(myimages[3],this.href, 'targetimage')"><img src="i/allegra/5s.jpg" width="180" height="85" hspace="0" vspace="0" border="0" /></a></p> </div></td></tr> <tr> <td valign="top" bgcolor="#EFEFED"><br /> <p align="left" class="style9"><br /> <br /> </p></td> </tr> </table> <p align="center"> </p> </body> </html> Do we have any alternative for orientation attribute of Td element in javascript for firefox? Below code works fine in IE but throws undefined in firefox: if(MyTd.orientation == "Vertical") //throws undefined { //Do something } The HTML for this Td is as follows: <td id="MyTd" orientation = "Vertical" ></td> Thanks. $_SESSION['order']['paymentmethod'] equals "Cheque". With the code bellow, I was expecting JavaScript to change the SELECT drop down menu to "Cheque", but it doesn't... However, when I remove the OPTION attribute value="cheque/", it works. This appears to be because there is a conflict with the OPTION attribute value and the SELECT content value "Cheque". Does anyone know how I can get around this issue? Code: <FORM action="" method="post" name="form"> <DIV> <SELECT class="verdana" name="paymentmethod" onchange="this.form.action = this.value;"> <OPTION></OPTION> <OPTION value="cheque/">Cheque</OPTION> <OPTION value="visa/">Visa</OPTION> </SELECT> <BR> <BR> <INPUT type="submit" value="PROCEED"> </DIV> </FORM> <SCRIPT type="text/javascript"> document.forms["form"]["paymentmethod"].value = "<?php echo $_SESSION['order']['paymentmethod']; ?>"; </SCRIPT> i have the code: foreach($product_names as $product_row) { ?> <tr> <td > </td><td width='200px'><?php echo $product_row->getName();?></td> <td width='200px'><input type="checkbox" name="graphic[]" value="<?php echo $product_row->getId();?>" onclick="check()"/></td> <td width='200px'><input type="checkbox" name="text[]" value="<?php echo $product_row->getId();?>" onclick="check()"/></td> </tr> <?php } ?> and a submit button on the page. the i also have the javascript code for the onclick="check()" : <html> <head> <script type="text/javascript"> function check() { var graphics = document.getElementsByName("graphic[]"); for(i=0;i<graphics.length;i++) { if(graphics[i].checked) { if(document.getElementById('submit').style.display=='none') { document.getElementById('submit').style.display='block'; } } } var text = document.getElementsByName("text[]"); for(i=0;i<text.length;i++) { if(text[i].checked) { if(document.getElementById('submit').style.display=='none') { document.getElementById('submit').style.display='block'; } } } } </script> </head> so what all this means is i have two arrays of checkboxes for each product. as soon as i check any checkbox the submit button appears. i click on the submit button and i go to the next form. the problem now comes in if i click on the "back" button to go back to the previous page via the bwrowser..the submit button is disabled althou all my checkboxes that i checked, are still checked....i want the submit button to show??? please help?? thanks so i have a navigation bar and instead of clicking on it to another page on the site where everything reloads again i want it to just reload the content area, so i have 5 tables of content each representing a different page and i just want it this way so i can implement something else that doesnt have anything to do with this Code: <script type="text/javascript"> var page = 1; function setPage1() { page = 1; } function setPage2() { page = 2; } function setPage3() { page = 3; } function setPage4() { page = 4; } function setPage5() { page = 5; } function setBlank1(x) { if (page==1) { x.class="content"; } else { x.class="blank"; } } function setBlank2(x) { if (page==2) { x.class="content"; } else { x.class="blank"; } } function setBlank3(x) { if (page==3) { x.class="content"; } else { x.class="blank"; } } function setBlank4(x) { if (page==4) { x.class="content"; } else { x.class="blank"; } } function setBlank5(x) { if (page==5) { x.class="content"; } else { x.class="blank"; } } this is my javascript so whats supposed to happen is when someone clicks a link on the nav bar it sets the page to that value so only that value is showing. i put the functions setPage1-5 in class="setPage1(this)" according to what content area they go too Code: table.blank { display: none; that is my blank class attribute so its not there but its loaded please ask me any questions and sugest anything im not a javascript expert or anything of that sort but ive been looking this over for a couple days now and i cant find anything online either Hi, I have been attempting to transition to use of xhtml strict doctype and my text editor, BBEdit (on Mac) tells me, when I ask it to check syntax, that the attribute 'name' is not allowed in form object, as in any other form element that I tried to use it in. This begs the question, how do I script forms with javascript in the context of this doctype? None of the javascript texts I have address this issue (O'Reilly Rhino book and others). I could figure it out, but it appears to be a complicated process, just doing getElementById() and sorting it out. Does anyone have a reference to material that deals with this issue? Or do I just abandon xhtml strict doctypes? Thanks for time and attention JK Hey all, 1) When clicking on a list in an accordion, it should change the quicktime movie playing in a main window area. It works in firefox but not in safari. The variable imgTitle holds the expected output (e.g. '../images/Intro-1.mov'). It changes the src attribute of the embed tag. This change works in Firefox where the new movie plays on click. However, when clicking the list item in safari, nothing happens. 2) There is a problem in firefox as well in that the movie overlays everything else on page, even though it should be behind the text. Positioning would be tedious given that there's many nested elements and I would have to set relative positioning to the entire page. Any reason for this behavior of embed tags? Code: $(".image_thumb ul li ul li").click(function(){ var imgTitle = $(this).find('a').attr("href"); var imgDesc = $(this).find('.block').html(); var imgDescHeight = $(".main_image").find('.block').height(); if ($(this).is(".active")) { return false; } else { console.log(imgTitle); $(".main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , function() { $(".main_image .block").html(imgDesc).animate({ opacity: 0.85, marginBottom: "0" }, 250 ); $(".main_image embed").attr({ src: imgTitle}); }); } $(".image_thumb ul li ul li").removeClass('active'); $(this).addClass('active'); return false; }) .hover(function(){ $(this).addClass('hover'); }, function() { $(this).removeClass('hover'); }); Thanks for response. Using this script in the head for processing ad links on the page: Code: <script type="text/javascript"> function clickTrack() { window.location="http://www.example.com" } </script> the ads are surrounded by: Code: <span onmouseover="this.style.cursor='pointer'" onclick="clickTrack(); return false;" onMouseDown="clickTrack(); return false;"> How do I make that open in a new window? Thanks Mike Hi there, can anyone let me know how to add an "ALT" tag to this bit of javascript? myimages[1]="html/images/cat-image-10.jpg" Cheers Referring to following link, I would like to determine the link for "In-Depth.xls", based on following coding, I find related information for Excel.png, does anyone have any suggestions on how to determine the URL for Excel file? Thanks in advance for any suggestions http://fx.aastocks.com/en/forex/mark...0&indicator=47 <img src="../../images/common/Excel.png" id="cp_imgExcel" class="btn" onclick="window.location.href='dbindepth.aspx?country=66970&startdate=2010/12/24&enddate=2011/12/24&indicator=47&excel=1'"/> THIS IS NOT HOMEWORK Hi all, See this image: The image represents an "entire" web page and the bright part the area currently scrolled into by the web browser. I can get the client's screen SIZE, but I don't know how to figure how many pixels down into a page the browser happens to be. To clarify, the distance shown as a question mark would be "zero" if the browser were scrolled all the way to the top of the page and some positive number as the browser scrolls down. Is there any way for me to get this number (in Javascript). What I need it for is to position a pop-up window centered left-to-right and 1/3-2/3 top to bottom on the screen REGARDLESS of where in the page the browser is scrolled. Thanks..... -- Roger Hi, I have a click event that changes an element from a span that acts like a text link, to a textbox that the user types in: Code: Event.add(area_el_rename, 'click', function(e) { if(!currently_renaming) { area_el.innerHTML = '<textarea name=\"renaming_area\" id=\"renaming_area\" style=\"width:100px;height:10px;background-color:#DCDCDC; resize:none;font-size:8px;\"></textarea><br>'; currently_renaming=true; } }); I am wondering if there is any way to determine if the user has clicked outside the textbox, and if so, perform an action (in my case revert back to the <span>. The solution probably doesn't need to be tied to anything. It probably just has to be something like: if(click_outside_id("renaming_area")) { //do my desired action } Hello! I do my calendar (vertical) =) and I've done to date were down But how to do that day of the week displayed on the side of the date of Here is code: Code: <html><head><title>Calendar</title> <meta http-equiv="content-type" content="text/html; charset=windows-1251" /> </head> <body><center> <SCRIPT LANGUAGE="JavaScript"> <!-- Begin monthnames = new Array("January","Febrary","March","April","May","June","July","August","September","October","November","December"); var linkcount=0; function addlink(month, day, href) { var entry = new Array(3); entry[0] = month; entry[1] = day; entry[2] = href; this[linkcount++] = entry; } Array.prototype.addlink = addlink; linkdays = new Array(); monthdays = new Array(12); monthdays[0]=31; monthdays[1]=28; monthdays[2]=31; monthdays[3]=30; monthdays[4]=31; monthdays[5]=30; monthdays[6]=31; monthdays[7]=31; monthdays[8]=30; monthdays[9]=31; monthdays[10]=30; monthdays[11]=31; todayDate=new Date(); thisday=todayDate.getDay(); thismonth=todayDate.getMonth(); thisdate=todayDate.getDate(); thisyear=todayDate.getYear(); thisyear = thisyear % 100; thisyear = ((thisyear < 50) ? (2000 + thisyear) : (1900 + thisyear)); if (((thisyear % 4 == 0) && !(thisyear % 100 == 0)) ||(thisyear % 400 == 0)) monthdays[1]++; startspaces=thisdate; while (startspaces > 7) startspaces-=7; startspaces = thisday - startspaces + 1; if (startspaces < 0) startspaces+=7; document.write for (s=0;s<startspaces;s++) { document.write(); } count=1; while (count <= monthdays[thismonth]) { for (b = startspaces;b<7;b++) { linktrue=false; /////displays the date document.write("<br width='30'>"); if (count <= 31) { document.write(monthnames[thismonth]); document.write(" "); } for (c=0;c<linkdays.length;c++) { if (linkdays[c] != null) { if ((linkdays[c][0]==thismonth + 1) && (linkdays[c][1]==count)) { document.write("<a href=\"" + linkdays[c][2] + "\">"); linktrue=true; } } } if (count==thisdate) { document.write("<font color='FF0000'><strong>"); } if (count <= monthdays[thismonth]) { document.write(count); } else { document.write(" "); } if (count==thisdate) { document.write("</strong></font>"); } if (linktrue) document.write("</a>"); document.write; count++; } document.write; document.write("<tr>"); startspaces=0; } document.write("</p>"); // End --> </SCRIPT> </center></body> </html> HI all. How do I determine whether a variable exists in a form. I have a form called "theForm". I want to determine whether the variable "THIRD_PARTY" exists in the form and if it has been set. Tracy greetings, I'm unable to find solution for dreamweaver reporting syntax error with the following page: http://www.redskyjewelry.com/test_product_detail.html I am revamping my website so the css is not set up for this page but that's okay. I have put in the various javascripts based on the product so the page is similar to a template. The syntax error is for the second set of boxes, the bracelet length options, and specifically for line with: form.amount.value = 6.5 inches; from the following script-- <SCRIPT language=javascript> function BraceletLength(form) { if (form.os0.value == "6.5 inches") { form.amount.value = 6.5 inches; form.item_number.value = "6.5 inches"; } if (form.os0.value == "7 inches") { form.amount.value = 7 inches; form.item_number.value = "7 inches"; } if (form.os0.value == "7.5 inches") { form.amount.value = 7.5 inches; form.item_number.value = "7.5 inches"; } if (form.os0.value == "8 inches") { form.amount.value = 8 inches; form.item_number.value = "8 inches"; } } </SCRIPT> I hope I have included enough information and I thank any input into this glitch I am having. I'll check back tomorrow, and thank you. judith When it occurred to me that I needed to calculate this, I knew it was over my head. (although I did come up with what I thought to be a pretty clever solution involving a very complex series of arrays...) So I decided to google it. The trouble is, the solution was a little over my head too... Sooo I hacked away at it for about an hour, and finally it worked, but on closer inspection I had made a typo from the original algorithm. So I thought I would pose the question to you all... Is the original algorithm correct, or flawed? is my interpretation correct/flawed, or the same? I'm not really sure what I did here, but after many tests, I think I got the correct solution. original post on http://stackoverflow.com/questions/3...ranges-overlap Quote: Let CondA Mean DateRange A Completely After DateRange B (True if StartA > EndB) Let CondB Mean DateRange A Completely Before DateRange B (True if EndA < StartB) Then Overlap exists if Neither A Nor B is true ( If one range is neither completely after the other, nor completely before the other, then they must overlap) Now deMorgan's law, I think it is, says that Not (A Or B) <=> Not A And Not B Which means (StartA <= EndB) And (EndA >= StartB) NOTE: This includes conditions where the edges overlap exactly. If you wish to exclude that, change the >= operators to >, and <= to < And finally the test scenario that I finally got to work: Code: <input onclick="this.value=''" onkeyup="TEST()" id=inhour1 value=1> <input onclick="this.value=''" onkeyup="TEST()" id=inminute1 value=1> <br /> <input onclick="this.value=''" onkeyup="TEST()" id=outhour1 value=2> <input onclick="this.value=''" onkeyup="TEST()" id=outminute1 value=1> <br /> <br /> <input onclick="this.value=''" onkeyup="TEST()" id=inhour2 value=3> <input onclick="this.value=''" onkeyup="TEST()" id=inminute2 value=1> <br /> <input onclick="this.value=''" onkeyup="TEST()" id=outhour2 value=4> <input onclick="this.value=''" onkeyup="TEST()" id=outminute2 value=1> <script> function ID(e){return document.getElementById(e)} function TEST(){ intime1=(parseInt(ID('inhour1').value,10)*60*60)+(parseInt(ID('inminute1').value,10)*60) intime2=(parseInt(ID('inhour2').value,10)*60*60)+(parseInt(ID('inminute2').value,10)*60) outtime1=(parseInt(ID('outhour1').value,10)*60*60)+(parseInt(ID('outminute1').value,10)*60) outtime2=(parseInt(ID('outhour2').value,10)*60*60)+(parseInt(ID('outminute2').value,10)*60) comp= (intime1 <= outtime2)&&(outtime1 <= intime2) ID('compare').innerHTML='' ID('compare').innerHTML+=intime1+'<br />' ID('compare').innerHTML+=outtime1+'<br />' ID('compare').innerHTML+=intime2+'<br />' ID('compare').innerHTML+=outtime2+'<br />' ID('compare').innerHTML+=comp+'<br />' } </script> <button onclick="TEST()">compare</button> <div id="compare"></div> Any feedback would help a lot! I fear using an algorithm that I don't fully understand in production code... Hi everyone, Is it possible to determine at the startup of the page if the visitor is using a computer or a phone to access the site? I would like to make the intro process much better than a simple "click here for HTML version or click here for Flash version". I would like for it to simply redirect to the page I set it to go to depending on whether or not they're using a regular browser or a mobile browser. How would I go about this? Thank you all very much in advance. I have a floating div that stays at the bottom of the browser window while the user scrolls down a long page. The div reads "scroll down for more". How can I determine the current position of the div in relation to the top of the page, not the top of the browser window. I need to determine this because I would like to hide the div when the user scrolls to the top of the last page. I have looked at offsetParent, offsetHeight, scrollHeight, etc. I have the code for everything except determining the position of the div, or the distance of the div from the top of the page. I need the code for if the user enters in a code into the field for example E1 and clicks submit it'll redirect them to a certain form. And if another user entered in E2 it would redirect them to a DIFFERENT form. I hope this is the correct category of the site for me to post this. Wasn't sure if it should be here or PHP.
I have a string of text, and starting from a particular spot (known to be a number), I want to find the length of that number. Here's what I have: Code: ... var start = [...predetermined...] var end = 0; while (!isNaN(sourceCode.charAt(start + end))){ endCurrent++; } var myNum = sourceCode.substr(start, end) * 1; So let's say var sourceCode = "alkdjabjasdsdf-53 dnalsdb..."; , startCurrent will already be at the "5" and I want to be able to extract the "53". What I have works, but it seems cumbersome... Any advice? |