JavaScript - Onclick Disable Onclick
Is it possible disable an onclick after clicking it and then enable it from another onclick by id
Code: <img id="one" href="images/homepage/sliders/bonus_button.jpg" style="position:relative; top:30px; left:50px; height:30px; width:70px; float:left;"> This code runs when it is clicked: Code: $("#one").click(function() { runEffectB(); return false; }); What I would like to happen is for either runEffectB() to not run if it was just run or to disable the #one.click once it has run. I am assuming I will be able to re-enable it from another onclick running a similar function. This is jquery and jquery ui if that helps. Any ideas much appreciated. Similar TutorialsAll, I have the following code: Code: <input type="button" name="button" value="Submit" onclick="javascript:get(this.myform);"> How can I change this to make this button disabled after the onclick? Thanks in advance. I'm currently working on a project and I am doing a bunch of image switching. I'm having a problem with the following... I have seven medium image objects and one small one. One is at the top and the other 7 are below. When one of the 7 is clicked, it then becomes the one up top and the one up top then takes the place of the image clicked. This needs to be able to happen no matter which of the seven i click. Also when you click one of the seven it runs a script to change 9 other images in the center of the page. this isnt too important because i have it working already. What i have is, each of the seven images run their function that changes the 9 center images and then it runs another function. What i need is for that function to determine which company for example(shaws, lowes, target) the top image belongs to and replace the image that was clicked with the top one. But i also need to replace the NAME="" and ONCLICK="function()" with the proper ones for the original company up top. Please if you can understand what im trying to do let me know, if you need further clarification i can do so. i can draw a picture of what im trying to do or the layout if needed but i cant necessarily show anyone the project due to a non-disclosure. Hey. When a checkbox is checked, I want it to add the id number of what I've got in a PHP variable, to appear in a <input type="text" />. For example: The id is 1, 2, and 3. So 3 checkbox's. I click on the first, and it adds to another input field, '1'. I hit the second, and the same thing happens, except the id is 2. Of course, I know how to do the ID and all with PHP. All I need to do now, is where when you click a check box, it adds to another field, and adds & after every check. Here is my code: Code: <input type="checkbox" name="delete" onclick="this.checkedbox.style.display=(this.value=='checked' ? 'inline' : '2' )" /> <input type="text" name="checkedbox" /> Thanks. <a href="#" onClick="showClubs(<% Response.Write x_ID_Nanny %>);" > Now this showclubs function shows a hidden div and at the end I have a return:false; but when you click on the link - it still seems to reload to the page and take you to the top how can I get it to just show the div without seeming to reload the page? Hello... Here is an example of a site I'm working on: http://mrmatthewreese.com/surine/custominlays.php notice the links for the alien cross bones, celtic knot etc...change colors once they are clicked on? Is it possible to have the top (alien crossbone) be set to black before it is clicked on then changed to the grey color once a different link is clicked? Just curious if anyone can help. Here is the javascript code: <script language="JavaScript" type="text/javascript"> /*<![CDATA[*/ var Lst; function CngClass(obj){ if (Lst) Lst.className=''; obj.className='boldlink'; Lst=obj; } /*]]>*/ </script> <a href="#" onclick='changeimage();'><span onclick="CngClass(this);">Alien Crossbones</span></a><br /> <a href="#" onclick='changeimage2()'><span onclick="CngClass(this);">Celtic Knot</span></a><br /> <a href="#" onclick='changeimage3()'><span onclick="CngClass(this);">Compass Rose</span></a><br /> <a href="#" onclick='changeimage4()'><span onclick="CngClass(this);">Fleurdelis</span></a><br /> <a href="#" onclick='changeimage5()'><span onclick="CngClass(this);">Geometrix</span></a><br /> <a href="#" onclick='changeimage6()'><span onclick="CngClass(this);">Modern Vine</span></a><br /> <a href="#" onclick='changeimage7()'><span onclick="CngClass(this);">Nouveau</span></a><br /> <a href="#" onclick='changeimage8()'><span onclick="CngClass(this);">Scorpion</span></a><br /> <a href="#" onclick='changeimage9()'><span onclick="CngClass(this);">Traditional Block</span></a><br /> <a href="#" onclick='changeimage10()'><span onclick="CngClass(this);">TrebleBass Clef</span></a> Hey guys, OK, so I have two buttons (code below) that when a user clicks on it, it will place text in a textarea. You can view all the code below: Buttons: Code: <div id="newButton"> <a href="#"><img src="http://i49.servimg.com/u/f49/17/29/94/19/graphi10.png" alt="Request a Graphic"></a> <a href="#"><img src="http://i49.servimg.com/u/f49/17/29/94/19/review11.png" alt="Request a Review"</a> </div> The textarea ID is: Code: text_editor_textarea and this is the code that I would like to be placed inside the textarea: Code: Nature of Request: Creation Size: Primary Colors: Text To Insert: Donation: Extra Information: URL: I tried this, but the BBCode would not keep it's structure and would all end up on one line. EDIT: Oh...The BBCode is parsing inside the code box >.< Hi i have a page that allows the user to enter details and also upload an image , I have onclick event on a submit button that goes off and performs a geocode on the postcode and saves the lat long to a database along with the other details they enter ( which all works fine) . The problem is that when i use the onclick event with the submit button it seems to bypass the onclick JS function and just go straight to the image upload bit. Can a button be a submit button and also have an onclick event or is there anything else i can do to fix the problem? hi everybody.. i have this simple code: Quote: <html> <head> <script language="javascript" type="text/javascript"> document.write("<input type='button' value='push' onclick='hi()'/>"); function hi() { alert("hi"); document.write("<input type='button' value='enter' onclick='javascript: bye()'/>"); } function bye() { alert("bye"); } </script> </head> <body> </body> </html> if i try to run it on chrom its works well.. but on IE or FireFox its not define the bye() function.. whats the reason?! and how i can solve it?.. thanks very much.. Hey guys, I'm trying to obtain the object of the element on the page that is clicked, but my code is unable to set the target. Here's what I have. The JavaScript Code: function show_info(e){ //get the targeted element. var targ; if (!e) var e = window.event; if (e.target) targ = e.target; else if (e.srcElement) targ = e.srcElement; if (targ.nodeType == 3) targ = targ.parentNode; alert (targ); //FAIL! } The Form Code: <form action="#" method="post"> <input type="hidden" name\"id" value="" /> <input type="submit" name="submit" value="Info" onclick="show_info()"/> </form> What I want to do is get the target element(the submit button) so that I can get its sibling(it contains a unique ID). But it's not working. Hi, I'm working on a small bit of code that passes a logged in users email address and name to a live chat form (Zompim & WHMCS) http://api.zopim.com/#setName By striping the code from the above page, I've managed to get it to work when the link is clicked, but I needed to have the variables passed upon page load. If anyone can point me in the right direction that would be great, me and Javascript don't work too well together! Here is what I have so far http://myautodj.com/zomp_test.php (your request a chat, and click on the run script link - that passes the demo email and name) Here is the code Code: <pre><script> $zopim.livechat.set({ language: 'en', name: 'Visitor', email: 'visitor@site.com', onStatus: function(s) { alert(s) } }); </script></pre> <script> (function() { var pres = document.getElementsByTagName('pre'), i; for (i=0; i<pres.length; i++) { buildLiveExample(pres[i]); } function buildLiveExample(p) { var code = p.innerHTML.replace(/>/g, '>').replace(/</g, '<'); var div = document.createElement('div'); if (code.search('<script>') == 0) { var a = document.createElement('a'); a.innerHTML = 'run script'; a.href = '#'; a.onclick = function() { eval(code.replace(/<\/?script>/g, '')); return false; }; div.appendChild(a); } else { div.innerHTML = code.replace(/<script>[\s\S]*?<\/script>/g, '') var code_blocks = code.match(/<script>[\s\S]*?<\/script>/g); if (code_blocks) { for (var i=0; i<code_blocks.length; i++) eval(code_blocks[i].replace(/<\/?script>/g, '')); } } p.parentNode.insertBefore(div, p); } })() </script> <script type="text/javascript"> document.write(unescape("%3Cscript src='" + document.location.protocol + "//zopim.com/?4vXfkefMFbxeWAVPjvRvWnBodfrGzctq' charset='utf-8' type='text/javascript'%3E%3C/script%3E")); </script> I am currently working with a website that I would like the navigation buttons to change when clicked, but when another is clicked the previous is unclicked. If possible I would like to incorporate a rollover function that changes the image, and then when it is clicked the image stays. I am building a website with frames (not my idea) so when each of these buttons is clicked a frame is changed. I currently have everything setup with the frames and the graphics incorporated. I know how to do mousovers in css, but I'm not sure how to do it in javascript. I just have a simple table with images in rows so it really won't do me much good to show my code. Any help would be appreciated! Hello forum, My name is juan and recently started html programming. I have a web page with a drop box with the name of states. Code: <option value="">Alabama</option> <option value="">Alaska</option> I can add a onclick="code here" to the tag so that when the drop box alabama is selected it triggers the onclick event. Im using Ibox in order to have a image of the state open. Code: <a href="images/large/image_1b.jpg" rel="ibox" title="alabama at 1024x450!"><img src="images/small/image_1.jpg" alt=""/></a> the above is a <a> link tag correct? How do I go bout adding the above code into the onclick event? Hi, I use mostly PHP with my office's website as it usually requires some interaction with the server. However, i would like to do something that does not, and figured JS should be able to take care of it. I just can't get my head around it and would like to ask for some guidance...not the answer per say, just helping me get on the right path would be great! What i would like to do seems rather simple: I have a calendar. I would it to do one of two things: 1. Using onclick, when the user clicks on a date, i would like it to print something underneath the calendar. Similar to an error message that shows up on a login form if you type something wrong in a field using PHP (if(isset($whatever))). 2. Or using onMouseover, if the user hovers over a date that i have something special scheduled, i want a message to either pop up (alert()) or similar to #1, show up below the calendar. While fiddling with it this afternoon i figured i was close, but i am missing something... Code: <td><a href="#" onclick="document.getElementById("27").innerHTML='President's Day'; return false;">27</a></td> But this seems to be pulling information from an element whose id = 27...which is not what i'd like.. Thanks in advance, Tsiqueira I am attempting to have a link hide and unhide a div It works in Chrome and Firefox, but not in IE The only thing that does not work is when i click it, it dosen't unhide or change the title, so basically, function unHide is not running, although there are no errors thrown. I have this in the top of the page Code: document.getElementsByClassName = function(className){ var hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)"); var allElements = document.getElementsByTagName("*"); var results = []; var element; for (var i = 0; (element = allElements[i]) != null; i++) { var elementClass = element.className; if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass)) results.push(element); } return results; } function hider(){ var eles = document.getElementsByClassName('hider'); for(var i = 0; i < eles.length; i++){ var theid = eles[i].id; eles[i].innerHTML = "<div style='display:block; text-decoration:none; color: black; clear:both; text-align:right; float:right; margin-top:-40px; margin-right:3px;' class='open'><a href='#' onClick=\"unHide('" + theid + "'); return false\" > Click To Open </a></div><div class='hides'> " + eles[i].innerHTML + "</div>"; } } function unHide(a){ var eles = document.getElementById(a); str = eles.innerHTML; if(str.search("> Click To Open <") == -1){ str = str.replace("> Click To Close <", "> Click To Open <"); str = str.replace("class=\"nothides\"", "class=\"hides\""); } else{ str = str.replace("> Click To Open <", "> Click To Close <"); str = str.replace("class=\"hides\"", "class=\"nothides\""); } eles.innerHTML = str; } and i have this where i want it to display and hide the section Code: <h4 onclick="unHide('editB')">Edit This Property</h4> <div id='editB' class='hider'> ... </div> The way it works is that it reads the page for all objects with the class name "hider" then it inserts two divs into "hider", one of them is a title that says: "click to open" and the other div has a class of "hides" that is set to display:none Once "click to open" is clicked, it uses .replace to find "click to open" and class=hide and change them to "Click to Close" and class=nothides if it is clicked again, it does the opposite. i just need to know why it isn't working in IE. Thanks in advance I am trying to use an onclick statement to go to an alternate web page displaying a different version of tha file being displayed in the current page. In the HEAD section of the current page I have a global variable named currentfile that contains a file name. This function is also in the HEAD section immediately below the variable's declaration Code: function altlink() { gotolink = "http://www.mydomain.com/testpage.htm?alt=" + currentfile; return gotolink } I have tried every combination I can think of in the onclick code to get it to work but, no joy. here is an example: Code: <a href="#" onClick=altlink(); return false; <img src="change.png" width="47" height="30"></a> If anyone here can sort me out I'd really appreciate it. I just can't get the next page to load. Code: <script language="javascript" type="text/javascript"> function limitText(limitField, limitCount, limitNum) { if (limitField.value.length > limitNum) { limitField.value = limitField.value.substring(0, limitNum); } else { limitCount.value = limitNum - limitField.value.length; } } </script> <textarea name="txt_area" rows="3" id="txt_area" class="style3" onKeyDown="limitText(this.form.txt_area,this.form.countdown, 500);" onKeyUp="limitText(this.form.txt_area,this.form.countdown, 500);" cols="20"></textarea><br> <font face='Arial' size="1" color='#336600'>(Maximum characters: 500)<br> You have <input readonly type="text" name="countdown" size="3" value="500"> characters left.</font> </td> This works great BUT, the value 500 (in 4 places in the above HTML) is a constant. I need this value to be set to a default when the page loads, but I have onclick events that change the style of the textarea and in doing so, I need the maximum allowed characters to change. So I need the constant value 500 to be a variable that changes with my onclick event AND gets initially set (I'm guessing) on page load..... I just do not know how to change this constant into a variable and make that variable change with onclick. Thank you. Ok, I have a submit form that allows the user to submit news, here is the final step of the form: Code: <form action="{$URL_submit}" method="post" id="thisform" name="ATISUBMIT" > <input type="hidden" name="phase" value="3" /> <input type="hidden" name="randkey" value="{$templatelite.post.randkey}" /> <input type="hidden" name="id" value="{$submit_id}" /> <input type="hidden" name="trackback" value="{$templatelite.post.trackback|escape:"html"}" /> <br style="clear: both;" /><hr /> <center> <input type=button onclick="javascript:gPageIsOkToExit=true;window.history.go(-1);" value="{#PLIGG_Visual_Submit3_Modify#}" class="log2"> <input type="button" onclick="javascript:submitEdgeStory();" value="{#PLIGG_Visual_Submit3_SubmitStory#}" class="submit" /> </center> </form> The submit button already has an "onclick" function via Javascript. What I want to add is a checkbox to the form, that when checked, the form will submit as per usualy, but will also open a new tab that will load a website. Is this possible to do? Thanks, Geoserv. I want the text in a textbox to change to red when I click the box and back to blue when I click it again. I would prefer an inline solution like: <input type="text" value="CHANGE COLOR" onclick="this.style.color='red';"/> Hi, I have created the following text input field: Code: <form name="xyz"> <input type="text" name="myText" size="30" value="Initial text" onclick="document.xyz.myText.value='';"/> </form> When the field is clicked the initial text is removed, clearing the way for new text to be entered, which is what I want. The trouble is if the field is again clicked the new text entered is also cleared which is not what I want. I only the field cleared for the first click and not for subsequent clicks. How can this be achieved? I will be grateful for all help. Hi all, I'm a js newbie and am filling in for someone on a job. He is dispalying banners on some pages and they want only one of the banners to click thru to a URL ("92002" is the banner id which needs to become a link) existing code is below: ---------------- function showBanner(id) { var arrBanners = new Array("72002", "12003", "63019", "72003", "53052", "83032", "62009", "52006", "73003", "73001", "92002"); for(var i in arrBanners) { if (id == arrBanners[i]) { var output = '<div><img height="130" width="693" border="0" src="/images/banners/banner' + id + '.jpg"/></div>'; document.write(output); return false; } } } ----------------- How do i do this? Many thanks |