JavaScript - Double Click To Remove?
I've been working with this script
Code: function changeImage(layer_id, item_id, position) { var theDiv = document.getElementById(layer_id); var theImg = (theDiv != null) ? theDiv.firstChild : null; if (theImg != null) { // If the item id is 0, then just make the image empty lol if (item_id == 0) { theDiv.parentNode.removeChild(theDiv) } else { theImg.setAttribute('src', 'images/' + layer_id + '-' + item_id + '.png'); } } else { var toAppend = '<div id="' + layer_id + '" style="position: absolute; z-index: ' + position + ';"><img src="images/' + layer_id + '-' + item_id + '.png" /></div>'; document.getElementById("item-images").innerHTML += toAppend; } } where layer_id, item_id, and position are all defined elsewhere. I've been trying to get the images to append, and then run this line Code: theDiv.parentNode.removeChild(theDiv) when you click on them consecutively(click to append, click again to remove, so three consecutive clicks would have the image shown and four would not), but all I've succeeded at so far is breaking the script's functionality. Help? Similar TutorialsOk know those people who are in the bad habit of double clicking everything? Well my site breaks if they double click it... is there a script I can use that won't let my functions run more then once every so many seconds? to avoid double clicking errors? hello I have a listbox full of names on a PHP website and was wondering if there was a way to grab the value during a double click to bring me to another form to display the name and information? Hi All, I have webform ,in that we have written some javascript for validation .we are calling this validatation while saving the form by using on client click event .Now we want to prevent the double time clicking the button .I have rounded the entire net but none of the code is not working because we have already calling the on client click function .I tried by calling 2 functions in on client click .But no use.Please suggeset some thing differnt and easy approach Awaiting for the reply I'm trying to figure out how to both make the text grey and when a user clicks inside a input field remove the helptext. So far I got this: Code: <input onfocus="this.select()" onblur="this.value=!this.value?'E-mail here':this.value;" name="name" value="E-mail here" type="text"> What this does is allmost correct, but it doesnt remove the predefined text "E-mail here", it just select it all, and then the text is not grey... Can somebody please guide me in the right direction... Thanks in advance! Hey guys just need a little help. I need to create a little script that clicks a link automatically and opens it up in a new page. So far I have this: Code: <head> <script> function autoClick(){ document.getElementById('linkToClick').click(); } </head> <body onload="setTimeout('autoClick();',3000);"> <a id="linkToClick" href="http://www.google.com" rel="nofollow" target="_blank">GOOGLE</a> </body> It works but the problem is that IE popup blocker keeps blocking the new window. Is there a way to do the same thing with javascript without it having blocked by IE popup blocker? the following javascript code is for a page that has to different login sections (username and password) hospital admin i want them to login in their part using normal IDs(numbers) and password, and normal users to login in the other login boxes (using email address and password) , each login boxes have their own submit button. the problem is i can't check each of them alone. what i want to do is that if (for user) email and password entered and pressed his login button, to be headed to another page, while if hospital admin entered his id and password in his section and pressed login button, to be headed for a different page. help please ! Code: window.onload = initForms; function initForms() { for (var i=0; i< document.forms.length; i++) { document.forms[i].onsubmit = function() {return checkFields();} } } function checkFields(){ if(document.getElementById("userLogin").onclick) { if(isEmail(document.getElementById("userUsername").value)==false) { alert("Please enter a valid e_mail address."); document.getElementById("userUsername").focus(); return false; } if(document.getElementById("userUsername").value=="") { alert("Please enter your e_mail address."); document.getElementById("userUsername").focus(); return false; } if(document.getElementById("userPassword").value=="") { alert("Please enter your password."); document.getElementById("userPassword").focus(); return false; } } if(document.getElementById("hospLogin").onclick) { if(document.getElementById("hospUsername").value=="") { alert("Please enter your ID."); document.getElementById("hospUsername").focus(); return false; } if(document.getElementById("hospPassword").value=="") { alert("Please enter your password."); document.getElementById("hospPassword").focus(); return false; } } } function isEmail(mail) { var char1 = mail.split("@"); var y = mail.indexOf("@", 0); var e = mail.indexOf(".", 0); var w = mail.lastIndexOf(".", mail.length - 1); var sp = mail.indexOf(" ", 0); var pl = mail.indexOf("@.", 0); for (i = 0; i < mail.length; i++) { if (mail.charAt(i) == "/" || mail.charAt(i) == ":" || mail.charAt(i) == ";" || sp > 0 || pl > 0 || mail.charAt(i) == '"' || char1.length > 2 || y == -1 || y == 0 || e == 0 || w == mail.length - 1 || e == -1) { return false; } } } and there goes the HTML codes: 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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="script.css" /> <script type="text/javascript" src="script.js"></script> <title>Blood high res END</title> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <div id="apDiv4" style="background:url(images/Blood-high-res-END_04.jpg) no-repeat"></div> <div id="apDiv1" style="background:url(images/Blood-high-res-END_01.jpg)"> <p>Hospital</p> <form name="hospForm" id="hospForm"> <input type="text" name="hospUsername" id="hospUsername" class="reqd" /><br /> <input name="hospPassword" type="password" id="hospPassword" class="reqd" /><br /><br /> <input name="submit" type="submit" id="hospLogin" value="Hospital log in" /></form></div> <div id="apDiv2" style="background:url(images/Blood-high-res-END_02.jpg)"></div> <div id="apDiv3" style="background:url(images/right.jpg)"> <a id="register" href="../User Registration Page/page.html" target="_self">Register Now</a> <a id="links" href="../Links/page.html" target="_self">Links</a> <p>Visitor</p> <form name="userForm" id="userForm"> <input type="text" name="userUsername" id="userUsername" class="reqd" /><br /> <input name="userPassword" type="password" id="userPassword" class="reqd" /><br /><br /> <input name="submit" type="submit" id="userLogin" value="User log in" /><br /></form> <a id="register2" href="../User Registration Page/page.html" target="_self">Register now</a><br /> <a id="forgot" href="../User Forgot Password/page.html" target="_self">Forgot Password</a></div> <div id="apDiv5" style="background:url(images/Blood-high-res-END_05.jpg) no-repeat"></div> <div id="apDiv6" style="background:url(images/Blood-high-res-END_06.jpg) no-repeat"> <p>Hello and welcome to Red Drop. By visiting our page,<br />you ensure to each and every one of the team crew <br />behind the stage, and to every lebanese person that<br />you are mentally prepared to donate a few drops of your<br />blood to the benefit of an anonymous stranger.<br /><br />With every drop you donate, you might be giving<br />a father, a mother or a child another day to live among<br />his family and his beloved persons.<br /><br />Register today and add donation blood to your frequently<br />social and humanitarian activities.</p> </div> <div id="apDiv7" style="background:url(images/Blood-high-res-END_07.jpg) no-repeat"></div> <div id="apDiv8" style="background:url(images/Blood-high-res-END_08.png) no-repeat"></div> <div id="apDiv9" style="background:url(images/Blood-high-res-END_09.jpg) no-repeat"></div> </body> </html> I havent added the server side scripts yet, i am planning to validate forms as much as possible using javascript first, and this is not for a real hospital, it's a graduation project, so to explain the point, on the page i have 2 seperated forms wich each having its own submit button, one to be used by hospital admins, and other to be used by users. For admins i just want to make sure their fields are not empty. For users i want to make sure their fields are not empty and their email field is valid. but when trying it, it's kinda only checks for the user fields. P.S: I apologize about not using codes, i didn't knew about this option. here is where the code is. http://simplythebest.net/scripts/DHT...script_15.html I need this to be able to open in the parent window not in another window. Or if someone could precribe a double drop box that works in "moonfruit" that would be great. Thank you very much for your time. David Hi, I have completed the necessary function and it does not need any changes however from the "alert" I need there has to be double quotes surrounding the search 'Lboro'. (I know I may be making a meal of the coding however the lecturer wants us to follow this due to everyone being at different levels of programming). I have used the '\' character however the double quotes do not end up in the position I require them?! My Coding function findAnyU (s){ var a = s , b , c , d , e = -1; for (var i = 0 ; i < pages.length && e == -1 ; i++){ b = pages[i].indexOf('['); c = pages[i].indexOf(']'); d = pages[i].substring(b+1, c).toLowerCase(); e = d.indexOf(s.toLowerCase()); } if(e >= 1) a += ' found' else a += ' not found' return (a) } alert (findAnyU('Lboro' , pages)); Current Alert = Lboro found Cheers George I want to detect the double-press of the space key. However, I want a single press of a space key to have a different function. The double-tap of space should only count if the taps of space are no more than, say, a half second apart. For example: The user hits space once, and javascript begins performing one action. 1/3rd of a second later, they hit the space bar again, and since that is within our threshold of 1/2 of a second, the action that began because the user hit the spacebar once should be cancelled, or undone (which I can write later) and the action when the user hits the spacebar twice should begin. Anyone have an idea how to do this? Thanks! Hi Can you please advise on this. When writing javascript what is best practice.... single or double quotes? I tried to research this and everyone contracdicts each other? thanks A Hey I am almost done with my API boot system and with the way I am calling new files it seems to double boot how can I stop this from happening as the page fully loads and that but the loader shown in the IE tab doesn't stop and it says '1 item remaining' and that never goes, both stay until you click anywhere on the document, so I was wondering if there is a way to stop this. My code to call the js document in the file 'boot.js'. Code: var o = 'http://www.example.com/file.js'; document.write("<script src=\""+o+"\" type=\"text\/javascript\"><\/scr"+"ipt>"); And in index.html I have this script tag Code: <script type="text/javascript" src="http://www.example.com/boot.js"></script> hi I wonder if someone out there can help me. I am very new to javascript and i have manged to understand a little of a double combo box with description however I would now like to be able to not only change the comment underneth but also add an image. This image (along with the comment) changes everytime the dropdownbox changes. I just cant seem to add the image. Please can anyone help I would really appreciate it and be extremely grateful. gr T I currently have a Drop-Down menu, which has headers you click on to show the links. This menu only allows one drop to be expanded at a time, and can be viewed here. I would like the headers to be able to have 'sub-headers' inside, which also drop-down,to reveal the links. I want them to have a different header colour, and to have the same rule where only one can be open at a time. while keeping the rule with the main headers. I have previously posted asking this, and got no reply, so I would really greatly appreciate any help and/support! Best Regards, Tim (P.S. I am still only learning JavaScript, and to make the current menu I have, took loads of help for a different project) Hi guys, I have written a double validation as below function validateDouble(ele){ // Custom trim funcation, i have written if(trim(ele.value) != ''){ var a = /^\d+(\.\d{0,2})?$/.test(trim(ele.value)); if(a){ return true; }else{ return false; } }else { ele.value = '0.00'; return true; } } I have copied from the net But this validation doesnt work when we enter the value as .65 (Means, it should accept this also, Please help me to change the regular expression) and in the same time when we enter this with out prefix, it should auto change to 0.65. Can some one help me to add in the above function. need to make "left click" act as "middle click" -------------------------------------------------------------------------------- I need to make "left click" act as "middle click" for a web site ....thank you in advance for any and all help... [CODE] <script language="javascript"> function Click(4) { if (event.button==0; 1; ) } document.onmousedown </script>> Hello, I am a hobbyist coder making a basic website for a friend, and I have a small problem. On an image slideshow, there is a counter at the bottom showing what image it is up to (ie 7/15), I'm not entirely sure how to change this into double digits (ie 07/15) I've found this thread (http://www.codingforums.com/showthread.php?t=212321) but am unsure how to integrate it into the slideshow I'm using, which is a different one. Here is the part from my JS I think that needs modifying: Code: if (setting.displaymode.type=="manual" && !setting.displaymode.wraparound){ this.paginatecontrol() } if (setting.$status) //if status container defined setting.$status.html(setting.curimage+1 + " / " + totalimages) Is this the right bit of code? If more of the code is needed to solve this please let me know. Any help is greatly appreciated! This is driving me nuts I need to replace all instances of "zz" with 'Z'. I can easily replace other strings such as a = a.replace(/mickeymouse/, "Z"); but a = a.replace(/zz/, "Z"); doesn't work. Must be a double characer thing? Hi, I'm Sam and I'm new to this forum. I have a few question about double combo box. Before I get down on details I have to confess that my knowledge about javascript is almost zer0 so if you're posting any answer please elaborate. I've found this code somewhere online and I'd like to make some changes to this code. I've searched everywhere but couldn't find any answer yet. As you can see in this code, the javascript function can open a page in iframe once the user clicks on "Go". I'd like to know how to add links to the options in the first box so that it can open an iframe by itself, plus loads the next box , so when the user selects an option from the first box, the first box opens a page in iframe then loads the options for the second box. There should be two iframes side by side, the first iframe to open a page for the first box once the user selects the options in the box and the second ifram opens a page for second box once the user clicks on the "go". I just don't know how to add links to the options in the first box. Here's the code: Code: <html> <head> </head> <body> <form name="doublecombo"> <p><select name="example" size="1" onChange="redirect(this.options.selectedIndex)"> <option>Technology Sites</option> <option>News Sites</option> <option>Search Engines</option> </select> <select name="stage2" size="1"> <option value="http://cssdrive.com">CSS Drive</option> <option value="http://www.news.com">News.com</option> <option value="http://www.wired.com">Wired News</option> </select> <input type="button" name="test" value="Go!" onClick="go()"> </p> <script> <!-- /* Double Combo Script Credit By JavaScript Kit (www.javascriptkit.com) Over 200+ free JavaScripts here! */ var groups=document.doublecombo.example.options.length var group=new Array(groups) for (i=0; i<groups; i++) group[i]=new Array() group[0][0]=new Option("CSS Drive","http://cssdrive.com") group[0][1]=new Option("News.com","http://www.news.com") group[0][2]=new Option("Wired News","http://www.wired.com") group[1][0]=new Option("CNN","http://www.cnn.com") group[1][1]=new Option("ABC News","http://www.abcnews.com") group[2][0]=new Option("Hotbot","http://www.hotbot.com") group[2][1]=new Option("Infoseek","http://www.infoseek.com") group[2][2]=new Option("Excite","http://www.excite.com") group[2][3]=new Option("Lycos","http://www.lycos.com") var temp=document.doublecombo.stage2 function redirect(x){ for (m=temp.options.length-1;m>0;m--) temp.options[m]=null for (i=0;i<group[x].length;i++){ temp.options[i]=new Option(group[x][i].text,group[x][i].value) } temp.options[0].selected=true } function go(){ document.getElementById("search").src=temp.options[temp.selectedIndex].value } //--> </script> </form> <iframe id="search" name="photos_frame" src="my_photo_page_needs_to_load_into_this_frame.htm" width=800 height=400 marginwidth=0 border=1 marginheight=0 hspace=0 vspace=0 frameborder=0 scrolling=no></iframe> </body> </html> I have the double combo script working on another website for an auto parts dealer with only 1 make so the options are Choose Model and then Choose Years for that model, i.e., 1979-1987 for one model and 1988-1994 for option 2 of the same model, and similar options for the other models. The links go to the cart for that Model/Year and everything works fine. This time I'm trying to set up the same script where this auto parts dealer has 21 Makes with a span of years for each make: 2011 to 1969, i.e., about 40 years for every Make. This parts dealer wants the years listed first and then the makes and from there I'll link to the cart for the model. I have the code set up (with only 4 years set up for the first Make as a test, which is VW/Audi) just so I can get it working, however after picking the year it's not letting me pick a make. It appears to choose one randomly with no other options. I have posted the code below minus most of the makes and years to save space I have three questions: 1. Is this the right script for this search pattern? 2. Is there a way to fix this so I don't have to list 40 years for every make?this would cause massive code bloat. 3. Is there an error in my code? PS. I'm not a Javascript programmer but do understand some of what it is doing. <form name="doublecombo"> <select name="example" size="1" onChange="redirect(this.options.selectedIndex)"> <option value="">Choose Year</option> <option>2011</option> <option>2010</option> <option>2009</option> <option>2008</option> <option>2007</option> <option>2006</option> <option>2005</option> <option>2004</option> </select><br> <select name="stage2" size="1"> <option value="">Choose Make</option> </select> <input type="button" name="test" value="Go!" onClick="go()"> <script> <!-- /* Double Combo Script Credit By JavaScript Kit (www.javascriptkit.com) Over 200+ free JavaScripts here! */ var groups=document.doublecombo.example.options.length var group=new Array(groups) for (i=0; i<groups; i++) group[i]=new Array() group[0][0]=new Option("VW/Audi 2011","http://www.....") group[0][1]=new Option("VW/Audi 2010","http://www.....") group[0][2]=new Option("VW/Audi 2009","http://www.....") group[0][3]=new Option("VW/Audi 2008","http://www.....") group[1][0]=new Option("Acura","http://www.....") group[2][0]=new Option("BMW","http://www.....") group[3][0]=new Option("Geo","http://www.....") group[4][0]=new Option("Honda","http://www.....") group[5][0]=new Option("Hyundai","http://www.....") var temp=document.doublecombo.stage2 function redirect(x){ for (m=temp.options.length-1;m>0;m--) temp.options[m]=null for (i=0;i<group[x].length;i++){ temp.options[i]=new Option(group[x][i].text,group[x][i].value) } temp.options[0].selected=true } function go(){ location=temp.options[temp.selectedIndex].value } //--> </script> </form> |