JavaScript - Keypress Event In Javascript
Similar TutorialsI am doing a program to teach pre-schoolers on how to use the keyboard. If there any possible if I press the arrow up key, It will then show a excellent swf, that I have make. if wrong if will come out try again swf using javascript. please help me. im stuck. Hi, I would like to increase my table row when users hit enter. Please find my html code below. Code: <form id="form1" name="form1" method="post" action=""> <table width="100%" border="1" align="center" cellpadding="0" cellspacing="0" id="tblSample"> <tr> <td align="center"><strong>NO</strong></td> <td align="center"><strong>DESCRIPTION</strong></td> <td align="center"><strong>QTY</strong></td> <td align="center"><strong>PRICE</strong></td> <td align="center"><strong>TOTAL</strong></td> </tr> <tr> <td align="center"><label> <input name="textfield2" type="text" id="textfield2" size="8" /> </label></td> <td align="center"><label> <input name="textfield" type="text" id="textfield" onclick="addRowToTable();" size="80"/> </label></td> <td align="center"><input name="textfield3" type="text" id="textfield3" size="8" /></td> <td align="center"><input name="textfield4" type="text" id="textfield4" size="8" /></td> <td align="center"><input name="textfield5" type="text" id="textfield5" size="8" /></td> </tr> <tr> <td align="center"> </td> <td align="center"> </td> <td align="center"> </td> <td align="center"> </td> <td align="center">total</td> </tr> </table> </form> Hey CodingFourm-ites! Ive scoured the internet for scripts that make a <div> follow the mouse, and have found one that seems to work well. However, I want the <div> to stop moving when the CTRL or the SHIFT key is pressed, I dont care which. Hopefully, I can have a div that follows the mouse at an offset that contains some click-able items, so a menu is always by your mouse. Ive tried now more than a few times to put together a piece of code that can achieve this, but none have worked. Can somebody write a script that can achieve this, or point me in the right direction? Thanks guys! Current JS for mouse follow: Code: var divName = 'mouseFollow'; // div that is to follow the mouse // (must be position:absolute) var offX = 15; // X offset from mouse position var offY = 15; // Y offset from mouse position function mouseX(evt) {if (!evt) evt = window.event; if (evt.pageX) return evt.pageX; else if (evt.clientX)return evt.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft); else return 0;} function mouseY(evt) {if (!evt) evt = window.event; if (evt.pageY) return evt.pageY; else if (evt.clientY)return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop); else return 0;} function follow(evt) {if (document.getElementById) {var obj = document.getElementById(divName).style; obj.visibility = 'visible'; obj.left = (parseInt(mouseX(evt))+offX) + 'px'; obj.top = (parseInt(mouseY(evt))+offY) + 'px';}} document.onmousemove = follow; The original code can be found at: http://javascript.about.com/library/blfollow2.htm I've spent days searching without luck. I need help with the following: I have a program that have some hotkeys set to trigger some events. I would like to activate those hotkeys from inside firefox by clicking on a button. I'm not looking for keypress events, it has to be a button click. So, let's say I click on the button that executes a javascript code that emulates F7 or CTRL+A or whatever key or key combination. Can you guys please help with to find a solution? Oh, and I need it to work with Firefox only. Thanks! Hi How I can simulate keypress in google chrome. I want to press a button to fire keypress event to print "X" in input box. On http://kisa.ca/cc/ I'm using JQuery's .keydown() to grab arrow keys. http://pastie.org/938572 But my friends using Linux are unable to use arrows to play the game: http://alteeve.com/files/cc.png Halp? A common javascript function that capitalizes input as user types (onkeypress) no longer works as of IE9. Need a function that also works in IE 9 that doesn't not change method call or interface (as it's used in 150 places throughout application). CALL: [CODE] el.onkeypress = function(el) { return c_capitalizeInput(el); } [CODE] FUNCTION: [CODE] // Intercepts keyboard input and capitalizes keystrokes. // Call with onkeypress="return capitalizeInput(event);" // Compatible with both IE and Netscape/Mozilla function c_capitalizeInput(evt) { evt = (evt) ? evt : ((window.event) ? window.event : ""); if (window.event) { // IE if ((evt.keyCode >= 97) && (evt.keyCode <= 122)) { evt.keyCode = evt.keyCode - 32; } return true; } else if (evt.which) { // Netscape and Mozilla key = evt.which; if ((key >= 97) && (key <= 122)) { key = key - 32; evt.target.value = evt.target.value + String.fromCharCode(key); return false; } return true; } else { return true; // Can't do anything for other browsers } } [CODE] Any suggestions to make this work in IE9? Hello everyone, If I type the name, and I check and Gender Scholar, my button will appear What I am looking to: Check my buttons, and when I start typing the name, the button Submit appear, st if I delete the text, the Submit button disappear Here's the script: Code: <head> <script type="text/javascript" src="jquery.validate.js"></script> <script> $(document).ready(function(){ $("#commentForm").validate(); }); function check_required(){ //alert(document.getElementById('rdo_boursier_oui').checked); //alert(document.getElementById('txt_lastname').value != ""); if((document.getElementById('rdo_boursier_oui').checked == true || document.getElementById('rdo_boursier_non').checked == true) && (document.getElementById('rdo_sexe_eleve_m').checked == true || document.getElementById('rdo_sexe_eleve_f').checked == true) && (document.getElementById('txt_lastname').value != "" ) ) { document.getElementById ('submit_etape2').style.display='block'; }else{ document.getElementById ('submit_etape2').style.display='none'; } } </script> </head> <form action="#" method="post" id="commentForm"> <input class="submit" type="submit" name="submit_etape2" id="submit_etape2" value="" style="display:none;"/> <p class="p_float"> <label for="lastname">Votre nom<span class="required_red">*</span></label> <input type="text" name="txt_lastname" id="txt_lastname" value="" class="required" minlength="3" onchange="check_required();" /> </p> <p class="p_float rdo"> <label for="boursier">Boursier<span class="required_red">*</span></label> <input type="radio" name="rdo_boursier" id="rdo_boursier_oui" value="" class="rdo_sexe_eleve snd_inscription required" onclick="check_required();"/>Oui <input type="radio" name="rdo_boursier" id="rdo_boursier_non" value="" class="rdo_sexe_eleve snd_inscription required" onclick="check_required();"/>Non </p> <p class="p_float rdo"> <label for="sexe">Sexe<span class="required_red">*</span></label> <input type="radio" name="rdo_sexe_eleve" id="rdo_sexe_eleve_m" class="rdo_sexe_eleve snd_inscription required" onclick="check_required();" value="">M <input type="radio" name="rdo_sexe_eleve" id="rdo_sexe_eleve_f" class="rdo_sexe_eleve snd_inscription required" onclick="check_required();" value="">F </p> </form> I assum the following html code: <div id="id1" onclick="click()">A<div> <div id="id2" onclick="click()">B<div> Do you know how to get ID = id2 when I onclick on A? Hai all, iam trying to use java script code in my jsp page. i used a onclick event.while clicking on the button that wil goes to the javascript function(deleteRecord(name,subject)). this deleterecord() wil post the url request. my code is like this ----------------- function deleteRecord(name,subject){ document.write("name received is:"+name); f.method="post"; var url="http://localhost/myproject/DeleteRecord?"; var url1= "name="+name; var url2="subject="+subject; var URL=url+url1+url2; f.action(URL); f.submit(); } my onclickevent code is' <td width="20%" height="25" align="left" valign="middle"><input type="submit" name="delete" value="Delete" style="background-color:#ff0000;font-weight:bold;color:#ffffff;" onclick="deleteRecord(<%=rs.getString("name")%>,<%=rs.getString("subject")%>);" /></td> --------------------------------------------- wil iam running my jsp page internet explorer is giving in variable subject (error:'divi' is invalid).divi is the value of the parameter name which iam passing to the function . and mozilla firefox my script is not working there is some syntax issues as wel as browser issues...and with url syntax can any one help me... Regards, Divya can someone please explain the code in this link. Just this small bit since i seen it in a few different places. it starts off with if (!e) ... please explain wth that means thank you so much heres the link - http://www.w3schools.com/js/tryit.as...ent_srcelement I have several list items in an html document. Each list item has an anchor tag and each anchor has an 'onmouseover' event. Is it possible to get the containing object for the event upon the mouseover? On my site we have image galleries that pop up over top of the page in a higher z-index and position:fixed, and another div between the gallery and background with opacity set to about 85%. The image gallery div has a close button, and I was asked to make the gallery also close by pressing ESC, so I added this: igevt=function(evt){checkclosegal(evt)} window.addEventListener('keypress',igevt, false) and checkclosegal: function checkclosegal(evt) { if(evt.keyCode==27) { closebgeagal() window.removeEventListener('keypress',igevt, false) } } This works perfectly in Firefox and Opera, but Chrome and Safari don't fire the event (not worried about ie right now - I know it uses attachEvent). Could it have something to do with the gallery being in a higher z-index? Please help, thanks! hello everyone, i am new to all this.. i need help regarding.. i am generating text box dynamically(mean it's a multiple select box, depending upon the number you select , it will generate that many text field.) my problem is that i want to assign a calender to the text field generated whenever a user clicks on that text field. i am able to do it for simple text field as onclick="javascript: showCalendar('idname')" but how to do it in this case, where can i declare this ? Hi guys, Probably a simple fix, the below code is for a form that is validated against some external (valid.js) functions. It's my first forray into Event Delegation and stupidly (testing in FF only just now) I didn't realise that the addEventListener isn't recognised in IE. Anyone got an idea which way I should look at sorting it. I am still searching and playing around but can't seem to find the right solution. Thanks in advance Code: document.addEventListener('keyup',function(event){ //IE doesn't pass in the event object var event = event || window.event; //IE uses srcElement as the target var target = event.target || event.srcElement; var strId = target.id switch(target.id){ case "M_FIRSTNAME": validEmpty(strId,"* Please enter your 'First Name'."); validChars(strId,Letters,"* Your 'First Name' contains invalid characters."); break; case "M_LASTNAME": validEmpty(strId,"* Please enter your 'Last Name'."); validChars(strId,Letters,"* Your 'Last Name' contains invalid characters."); break; case "M_EMAIL": validEmpty(strId,"* Please enter your 'E-mail Address'."); validChars(strId,Email,"* Your 'E-mail Address' should be in the format you@email.com."); break; case "M_EMAIL_CONF": validEmpty(strId,"* Please confirm your 'E-mail Address'."); validChars(strId,Email,"* Your 'E-mail Address' should be in the format you@email.com."); break; case "M_USERNAME": validEmpty(strId,"* Please enter your 'Username'."); validChars(strId,Alphanumeric,"* Your 'Username' contains invalid characters."); //objRegister.M_USERNAME.withinRange(6,12,"* Your 'Username' should be between 6-12 characters."); break; case "M_PASSWORD": validEmpty(strId,"* Please enter your 'Password'."); validChars(strId,Alphanumeric,"* Your 'Password' contains invalid characters."); //objRegister.M_PASSWORD.withinRange(6,12,"* Your 'Password' should be between 6-12 characters."); break; case "M_PASSWORD_CONF": validEmpty(strId,"* Please confirm your 'Password'."); validChars(strId,Alphanumeric,"* Your 'Password' contains invalid characters."); //objRegister.M_PASSWORD_CONF.withinRange(6,12,"* Your 'Password' should be between 6-12 characters."); break; } },true); Hi Everyone, How would i add an avent listener to change the source of an image? I have added the image to a canvas element through javascript using the code below. Code: var start = new Image(); start.src = "start.jpg"; ctx.drawImage(start, 50, 50); Thanks! hey, i am trying to add events to my website...i have all the events stored in my google calender and i am trying to show only four events at the time for example: 10/01/2011 - John's Birthday 12/01/2011 - Party i found this example on google however i am having problems...the problem i am having is that it works fine on my computer however when i look at it on another computer nothing appears http://gdata-javascript-client.googl...le_sample.html thanks Hello, I have a script I am using which works great, except when I copy the code and have multiple events it only shows the first one. This I believe is because it's calling the first class name of it's kind. I want the class's to be named the same thing (css styling) and because the site is going to be dynamically driven, but is there a way to modify my script so that instead of looking for the first class it recognizes the right class associated with the button clicked. If anyone can help me fix this problem I am having I would be most appreciative.. Code: <script language="javascript"> function toggle() { var ele = document.getElementById("commpopup"); if(ele.style.display == "block") { ele.style.display = "none"; } else { ele.style.display = "block"; } } </script> <div class="togglecomment"> <div class="popup" id="commpopup"> <div class="commentbtn"><a href="#"><img src="images/commenticon.png" align="absmiddle" />Comment</a></div> </div> <div class="button"><a href="javascript:toggle();"><img src="images/comment_btn.jpg" /></a></div> </div> Hello, I am working on a CGI/Ajax application to interface with a database. I have the back-end Perl/CGI application working, so now it it is time to design the web interface and respective forms. So here goes, I am attempting to create dynamic list boxes, but I am unable to pass a value to the 'onChange' event. Here is my code (this is a proof of concept and highly stripped down): Code: <html> <head> </head> <body> <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript"> var array = [ 'name', 'age', 'year']; function init(sel_val){ for (var i = 0; i < array.length; i++){ document.write(i + " " + array[i] + "<br />"); } for (var i = 0; i< array.length; i++){ document.product.id_type.options[i] = new Option(i + array[i], i); } } function OnChange(sel_val) { // for(i = document.product.id_style.length - 1; i > 0; i--) // document.product.id_style.options[i] = null; // document.product.id_style.options[0] = new Option("something else", 15); alert("pressed" + " " + sel_val + "<br />"); } </script> <form name="product"> <select name="id_type" size="5" style="width: 150px;" onChange="OnChange()"></select> <select name="id_style" size="5" style="width: 150px;" ></select> </form> <script> init(); </script> </body> </html> I'm well versed in Perl and Java but I am a JavaScript newbie, so go easy. I understand that sel_val is not being set, but I'm not sure how it should (or could) be set. I would like to use a hash instead of integer values for `i` document.product.id_type.options[i] = new Option(i + array[i], i); becomes document.product.id_type.options[i] = new Option(hash[key], key); Any thoughts, comments, criticisms, jokes are welcome. Thanks in advance for the assist. Q1. write a function called countAS that will take a string as input (using a prompt dialog box,prompt the user or the string).the string must contain only a's,b's and c's e.g. "abccbbaa" or "aaabbbccc" if any other letters are present apart from the letters a b c, output an alert dialog box with an error message and prompt the user again to input a valid string.count the number of a's the numbers of b's and the numbers of c's entered and display the count for each as well as a total count of all the characters within the string . for example if the string was abbcc output should be as follows: the total count is 5 characters The Number of a's is 1 The Number of b's is 2 The Number of c's is 2 Q2. write a code that uses an event handler to display an alert dialog box with the message 'hello to you all' when a user clicks a link in a html page which links to the school of computing website. |