JavaScript - Key Event Handling
Hi
I am new to Javascript. I am working in keyboard Event handling. i dont know how to handle multple keys pressed or sequence of keys pressed. Want to know more about key holding , key Listener. Similar TutorialsHi there, I've been a web designer for a while and have always used basic javascript in my pages, but decided recently that I would get right into the nitty gritty, however I'm having a problem with some really basic code. Secondly, the book which I'm using is from 2005 and is extolling the virtues of event listeners and so on, is this still the accepted means of handling events? And thirdly, are there still chasms between the browsers in compatability in this area? I'm aware IE has become more and more compliant recently, is it still necessary to write code to cover different browsers or does it all pretty much work nowadays (besides older browsers)? So, to the code! Basically, the browser doesn't get into the function to display the alert(), and i'm not sure why. (Told you it was basic ) Code: <html> <head> <title>Javascript Testing</title> <script type="text/javascript"> <!-- function aKeyWasPressed(e){ alert('Sausages!'); } var textarea = document.getElementById('myta'); textarea.addEventListener('keyup', aKeyWasPressed, false); --> </script> </head> <body> <textarea id="myta"></textarea> </body> </html> Thanks! Hi forum, I am trying to attach an event to a dynamically produced button, and then use stopPropagation and preventDefault. Code: function chapter12_nodeOne() { //create an element var element = document.createElement('input'); //set some attributes element.setAttribute('type', 'button'); element.setAttribute('value', 'submit'); element.setAttribute('id', 'myBtn'); //appendd the element into a DIV document.getElementById('myDiv').appendChild(element); //uses EventUtil to attach an event listener EventUtil.addHandler(element, 'click', function() { alert('event attached'); }); var flag = confirm('prevent default behavior of button?'); if (flag) { var el = document.getElementById('myBtn');/////////////////////////(1) var ev = el.onclick; } } var EventUtil = { addHandler: function(element, type, handler) { //check if the element and the browser support DOM Level 2 event attachment //if the user is not browsing with IE if (element.addEventListener) { element.addEventListener(type, handler, false); } //if user is browsing with IE else if (element.attachEvent) { element.attachEvent("on" + type, handler); } //if user is using a browser that only supports DOM Level 0 event attachment else { element["on" + type] = handler; } }, removeHandler: function(element, type, handler) { //check if the element and the browser support DOM Level 2 event attachment //if the user is not browsing with IE if (element.removeEventListener) { element.removeEventListener(type, handler, false); } //if user is browsing with IE else if (element.detachEvent) { element.detachEvent("on" + type, handler); } //if user is using a browser that only supports DOM Level 0 event attachment else { element["on" + type] = null; } } }; But when debugging I see under el on the line marked with (1) that the onclick event is null. What am I doing wrong?! PS:the event is attached, when I click on the button I get an alert message is it possible to capture the control.event or element.event that was fired to invoke the onbeforeunload event. for example, if a button is clicked and it causes the onbeforeunload event to fire can i determine which button was clicked. thanks I have a ondrag event handler and in that I am trying to retrieve e.ClientX but it always return 0 in Mozilla. Works fine in IE though. How can retrieve the clientX and clientY in ondrag event? I've used js only for simple form validations thus far. I've been working on a coldfusion/ajax dynamic select list for a few days and just about have it functioning the way I want it. My question is this. Whats the best way, if any, to handle users who turn js off. What I mean is, I have so far three separate queries for my three select lists, and are populated with ajax calls. Is there a way to get the same functionality with standard queries and page refreshes in case a visitor does have js disabled? Thanks for any tips and advice. Hi everyone; I have created a JavaScript function to show either a enabled or a disabled text input field depending on whether a checkbox has been clicked or not. It works great for that purpose. However, when I use it for more than one text input field and I submit the form, it goes back to its disabled form. This is a problem if you by mistake submit the form without filling all the fields. As I said, the submit button makes the form go disabled. Is there a way to either not have the form go disabled after submission or to have a "Oncheck" function so I can use $_SESSION to keep the checked attribute? Thanks in advance for all your help Code: <html> <head> <style type="text/css"> #Active { display:none; } </style> <script type="text/javascript"> function toggle() { if (document.getElementById) { if (document.getElementById("checkbox").checked == true) { document.getElementById("Active").style.display = "block"; document.getElementById("Inactive").style.display = "none"; } else { document.getElementById("Inactive").style.display = "block"; document.getElementById("Active").style.display = "none"; } } } </script> </head> <body> <?php echo "Add Field"; echo "<input type=\"checkbox\" name=\"check\" id=\"checkbox\" onClick=\"toggle();\" value=\"v\"/>"; echo "<form method=\"post\">"; echo "<div id=Active>"; if(isset($_SESSION['test']) && $_SESSION['test']!="") { echo "<input name=\"test\" value=\"". $_SESSION['test']."\" type=\"text\" />"; } elseif(isset($_POST['test']) && $_POST['test']!="") { echo "<input name=\"test\" value=\"". $_POST['test']."\" type=\"text\"/>"; } else { echo "<input name=\"test\" type=\"text\"/>"; } echo "<input type=\"text\" name=\"test2\" >"; echo "</div>"; echo "<div id=Inactive>"; echo "<input type=\"text\" disabled>"; echo "<input type=\"text\" disabled>"; echo "</div>"; echo "<input type=\"submit\">"; echo "</form>"; $test = $_POST['test']; $_SESSION = $_POST['test']; $test2 = $_POST['test2']; $_SESSION = $_POST['test2']; echo $test; ?> </body> </html> I don't have much experience in Javascript and would like to hear your suggestions before choosing which direction to pursue for my project. I want to design a web page which allows a user to input a file which contains a list of addresses. Then send these addresses to Google Maps API for geocoding and returned XY coordinates will be saved in a file and downloaded to the PC. Can this be done completely in Javascript(client side handling) or the input addresses need to be sent to a server and let the server talk to Google Maps API to complete geocoding and then send back the coordinates data to the browser(sever side handling). Please help!
Long time since I have been on here been really busy with college etc, I am in need of some help / advice on how to get my head around something I need to do. Basicly I want to do is be able to do two kinds of AJAX requests in one function called AJAX. Example of type one: Code: AJAX('div#example',{ type: 'post', url: 'example.php', params: {do:'test',type:2}, success: function(o) { this.innerHTML = o.responseText; } }); The above code will set the innerHTML of the div with an id equaling 'example' with everything that is visible on the page example.php when the parameters are do=test&type=2. Example of type two: Code: var div = document.getElementById('example'), example = AJAX({ type: 'post', url: 'example.php', params: {do:'test',type:2} }); if(div && example.responseText) { div.innerHTML = example.responseText; } The above code does the same thing as the code in example one but this time there is no success function but everything has been assigned to the variable 'example' which has now become an object. Basicly what I need to know is in a function like this. Code: function AJAX(t,o) {} How can I assign the current AJAX response to the success function but still be able to use 'this' to refer to the object for 'div#example', and with the second example how can I assign the AJAX response to the variable for use after the AJAX call has been done? Thank you in advance... - DJCMBear Resolved!
Hi, I have a func1() called when mouseOver even fired. And while the func1() is executing if mouseOut event fires I want to exit the func1(). If anybody knows how to do this please let me know. Thanks I've been looking at the specs for javascript, but I don't understand results I'm getting. A Date object is calculated from the number of milliseconds since Jan 1, 1970. A PHP DateTime object is calculated from the number of seconds since Jan 1, 1970, so from the latter, add three zeros, and you have milliseconds. The issue I have happens when I set the date. Below is the result of a test already filled out when I entered April 23, 2000 @ 17:00Hrs. The resulting alert shows 17:0, which is correct. But change the date to, say, 1981 and try it again. The corresponding timestamps are 356922000 and 356922000000 (Hard to see? That's '356922' ending in three zeros and six zeros respectively ;-)). My alert now reports 18:0! Since the timestamp should be good for any time after Jan 1, 1970, why is the display off for a date in this year? What mechanism is responsible for this? Yep, that's it. I'd really like to know, though... 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" /> <title>Simple Time Test</title> <link href="notifications.css" rel="stylesheet" type="text/css" media="screen" /> <script language="javascript" type="text/javascript"> function display_time(){ var theTime=new Date(); theTime.setTime(956534400000); alert(theTime.getHours()+':'+theTime.getMinutes()); } </script> </head> <body> <form> <input type='button' onclick='display_time();' value='click' /> </form> <?PHP /* 1. First put a date and time in the setDate() and setTime() calls. 2. Run this. The result will be a timestamp. Place that in the setTimestamp call, AND copy it into the setTime javascript call, appended with three zeros (to go from seconds to milliseconds). 3. I'm finding that when the alert pops up, the time it displays is not always the same as the output from the echo statement! */ echo '<br />'; $t3_var = new DateTime(); $t3_var->setDate(2000,04,23); $t3_var->setTime(17,0); echo 'timestamp: ' . $t3_var->getTimestamp(); echo '<br />'; $decoder1 = new DateTime(); $decoder1->setTimestamp(956534400); echo 'time: ' . $decoder1->format('m-d-Y, H:i') . '<br />'; ?> </body> </html> Hi I am using httpXmlRequest object to call a xml web service. In order to successfully perform a task there are couple steps need to happen. 1 you have to request for a session (cookie) 2 with the cookie, we need to authenticate with the server 3 then perform other actions snippet of my code looks something like this. Basically here i am trying to get the cookie, login and then logout once logged in. function connect() { document.myForm.elements['myTextArea'].value += "connecting to teh server.\n"; try { xhttp.open("GET",urlStr + commonInfoParam, true); xhttp.send(); xmlDoc = xhttp.responseXML; xmlDoc.onreadystatechange = function () { if(xmlDoc.readyState == 4) { var resultsTag = null; resultsTag = xmlDoc.getElementsByTagName("results"); if(resultsTag != null) { for(i=0;i<resultsTag.length;i++) { var commonTag = resultsTag[i].getElementsByTagName("common"); for(j=0;j<commonTag.length; j++) { cookie = commonTag[j].getElementsByTagName("cookie")[0].childNodes[0].nodeValue; break; } } } if(cookie != null) { document.myForm.elements['myTextArea'].value += "cookie found: " + cookie + "\n"; login(); } } }; } catch(e) { document.myForm.elements['myTextArea'].value += "Exception occurred at connect: " + e.message + "\n"; } } function login() { var loginRequestURL = "http://testconnect.com/api/xml?action=login&login=" + username+ "&password=" + password + "&session=" + cookie; try { xhttp.open("GET", loginRequestURL, true); xhttp.send(); xmlDoc = xhttp.responseXML; xmlDoc.onreadystatechange = function () { alert('in loginResponseHandler'); if(xmlDoc.readyState == 4) { try { loginStatus = xmlDoc.documentElement.childNodes[0].attributes.getNamedItem("code").nodeValue; if(loginStatus == 'ok') { alert("login is good: " + loginStatus); logout(); } else { } } catch(e) {} } }; } catch(e) { } } function logout() { alert("in logout"); try { xhttp.open("GET", logoutRequestURL + cookie, true); xhttp.send(); xmlDoc = xhttp.responseXML; xmlDoc.onreadystatechange = function () { alert("in logoutResponseHandler"); if(xmlDoc.readyState == 4) { try { status = xmlDoc.documentElement.childNodes[0].attributes.getNamedItem("code").nodeValue; if(status == 'ok') { alert(status); } } catch(e) {} } }; } catch(e) {} } so when I run my code in the browser, all my alert stages give me proper message as expected. But at the final alert, it hangs. I just could not figvure out what am i doing wrong. can any one pin point this out for me please? Thanks in advance. KM so, I should start by saying that I don't really understand callbacks (but I understand what they do), and here's the thing: html5 browser geolocation has an error callback which works fine EXCEPT if the user is using FF and refuses to share their location. In IE and Chrome, this produces a "permission denied" error which you can then handle. But firefox just sits there because it never receives the error. Here's an example - click on Not now in FF to see what I mean. So the only solution I can see is to make some special case for FF and this is where my question comes in - can I set a condition within the callback that says something like if it wasn't successful, but you didn't get an error, do this... I thought that if (!position&&!error) {useMaxMind("Firefox fallback"); } might do it, but it can't go in the error callback (I guess because that only fires if an error is detected) and it doesn't work in the main function (I guess because if that code runs it means the location has been found)... anyway. Here's what I have for the moment, which just sets a timeout as soon as it loads. It would be nice to have something a bit more elegant, though. thanks in advance... Code: function initialize() { // try W3C standard approach var geoTimeout = 10000; var timeOuthandler = setTimeout("useMaxMind('Timeout')", geoTimeout); if(navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position) { var latLong = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); alert("geolocation successful"); clearTimeout(timeOuthandler); showMap(latLong, 16); }, function (error) { switch (error.code) { case 0: message = "Something went wrong: " + error.message; break; case 1: message = "You denied permission to this page to retrieve a location."; break; case 2: message = "The browser was unable to determine a location: " + error.message; break; case 3: message = "The browser timed out before retrieving the location."; break; } clearTimeout(timeOuthandler); useMaxMind(message); }, {timeout:geoTimeout} ); } else { useMaxMind("No browser support"); } } Hi, I think the problem I am having is an event not a css issue, so I hope I posted in the right forum. What I am trying to achieve is the capability to provide multiple instant chat messages. I have the php/ajax for the instant messages, what I am not sure is how to be able to view multiple chats. What I have started to do is limit it to five possible instant chat messages and have five divs in place with visibility hidden. It works fine for one. But if someone clicks on the name of a person they wish to chat with, the way I am currently doing it, I would need to find out: 1. which divs were free to start an instant chat in (I have no idea how to do this with divs)? 2. Having identified it I will need to change the visibility so it suddenly becomes visible I guess firstly am I going about this the right way to be able to host/view multiple chats? My code is below. Main Page PHP Code: <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function (){ $('#submitchat').live('click',function(){ var data = $('#chatmessage').serialize(); $.post ('insertChat.php',data, function(){ $('#chatmessage').each (function(){ this.reset(); }); return false; }); }); }); </script> <script type="text/javascript"> function loadChat(File,ID,Msg,TID,Cile){ loadXMLDoc1(File,ID,Msg); delay = setTimeout(function(){loadChatRefresh(Cile,TID,Msg)},5000); } </script> <script type="text/javascript"> function loadChatRefresh(File,ID,Msg){ if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { try{ xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; timer = setInterval(function(){loadChatRefresh(File,ID,Msg)},3000); } } var params=Msg; xmlhttp.open("POST",File,true); xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache"); xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlhttp.setRequestHeader("Content-length", params.length); xmlhttp.setRequestHeader("Connection", "close"); xmlhttp.send(params); } </script> <script type="text/javascript"> function loadXMLDoc1(File,ID,Msg){ if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { try{ xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; } } var params=Msg; xmlhttp.open("POST",File,true); xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache"); xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlhttp.setRequestHeader("Content-length", params.length); xmlhttp.setRequestHeader("Connection", "close"); xmlhttp.send(params); } </script> </head> <body> <h1>Test</h1> <?php include("dbconnect.php"); $result = mysql_query("SELECT *, signedin.PId as SIPId FROM signedin INNER JOIN friends ON signedin.PId=friends.invited OR signedin.PId=friends.invitee WHERE ((friends.invitee={$_SESSION['MyPId']} AND friends.statae='accepted') OR (friends.invited={$_SESSION['MyPId']} AND friends.statae='accepted')) AND signedin.LogOff IS NULL AND signedin.PId !={$_SESSION['MyPId']}"); while($row = mysql_fetch_array($result)){ $mugwort= $row['SIPId'] . ';'; } $motherwort=explode(';',$mugwort); foreach ($motherwort as $mulberry){ $result = mysql_query("SELECT * FROM allusers WHERE PId='{$mulberry}'"); while($row = mysql_fetch_array($result)){ $nosegay=rand(). rand(). rand(). rand(). rand(); $nightshade="{$_SESSION['MyPId']};{$mulberry};{$nosegay}"; echo '<div class="img"><img src="thumbs/' . $row['pphoto'] . '" height="80px" width="80px" onclick="loadChat(\'chat.php\',\'chat1\',\'olivier=' . urlencode($nightshade) . '\',\'chatdisplay\',\'getDisplayChat.php\')";><div class="desc">' . $row['fullname'] . '</div></div><br />'; } } echo '<br /><div class="clear"></div><br /><br />'; ?> <div class="chat1" id="chat1"></div> <div class="chat2" id="chat2"></div> <div class="chat3" id="chat3"></div> <div class="chat4" id="chat4"></div> <div class="chat5" id="chat5"></div> <br /> <br /> Chat Page PHP Code: <?php include("dbconnect.php"); $blossom=explode(';',$_POST['olivier']); $periwinkle=$blossom[0]; $peppermint=$blossom[1]; $pine=$blossom[2]; global $periwinkle; global $peppermint; global $pine; echo '<div class="chatbanner" width="100%"> <table width="100%"> <tr> <td width="90%">'; echo '<center><b>This Name</b></center>'; echo '</td> <td width="5%">'; echo '<input type="button" class="buttonchat" name="minimize" id="minimize" value="−">'; echo '</td> <td width="5%">'; echo '<input type="button" class="buttonchat" name="minimize" id="minimize" value="X">'; echo '</td> </tr> </table></div>'; echo '<div class="chattext" id="chatdisplay" overflow="scroll">'; $result = mysql_query("SELECT * FROM chat INNER JOIN allusers ON chat.chatter=allusers.PId WHERE (chat.chatter={$periwinkle} AND chat.chattee={$peppermint}) OR (chat.chatter={$peppermint} AND chat.chattee={$periwinkle}) AND ref={$pine} ORDER BY chat.date DESC"); while($row = mysql_fetch_array($result)){ echo '<table width="100%"><tr><td width="20%"><img src="thumbs/' . $row['pphoto'] . '" width="40px" height="40px"></td>'; echo '<td width="80%" valign="top">' . nl2br($row['message']) . '</td></tr></table><hr />'; } echo '</div><br /><br />'; echo '<form action="insertChat.php" method="post" name="chatmessage" id="chatmessage"> <input type="text" class="hidden" name="from" id="from" value="' . $_SESSION['MyPId'] . '"> <input type="text" class="hidden" name="to" id="to" value="'; echo ($_SESSION['MyPId']==$peppermint) ? $periwinkle : $peppermint . '"> <input type="text" class="hidden" name="ref" id="ref" value="' . $pine . '">'; echo '<div class="textchat">'; echo '<textarea cols="21" row="5" name="message" id="message"></textarea>'; echo '<input type="button" name="submitchat" id="submitchat" value=" "></div></form>'; ?> Style Sheet: Code: div.chat1 { position:fixed; bottom:1px; right:50px; width:200px; height:250px; float:right; border:2px solid black; background-color:#fdf5e6; scrolling:auto; } div.chat2 { position:fixed; bottom:1px; right:260px; width:200px; height:250px; float:right; border:2px solid black; background-color:#fdf5e6; scrolling:auto; } div.chat3 { position:fixed; bottom:1px; right:470px; width:200px; height:250px; float:right; border:2px solid black; background-color:#fdf5e6; scrolling:auto; } div.chat4 { position:fixed; bottom:1px; right:680px; width:200px; height:250px; float:right; border:2px solid black; background-color:#fdf5e6; scrolling:auto; } div.chat5 { position:fixed; bottom:1px; right:890px; width:200px; height:250px; float:right; border:2px solid black; background-color:#fdf5e6; scrolling:auto; } .chatbanner { background-color:#4b0082; text-decoration:none; color:white; } .textchat { position:fixed; bottom:0.5px; } .chatbutton { position:fixed; bottom:0.5px; right:0.5px; border:none; } If I have left anything out which might be helpful please let me know. I just got stuck on the logistics side of figuring out how was the best way to make this happen, any pointers would be great. Hopefully the title isn't too confusing, I shall explain... I'm a basic PHP/javascript developer and I need to build a series of forms where info is passed from page to page and there will be a need to skip to different sequences of pages depending upon answers given. I have distilled this into a small example (try.php) where I can set my page destination using javascript but I'd like to be able to set a session variable to store the form data to reuse it on other pages. Because I haven't used a form action then the result doesn't get stored. This example should make it clearer... Here is a simple form, I send the visitor to either page 1 or page 2 depending on their radio button choice: Code: <script type="text/javascript"> function OnSubmitForm() { if(document.myform.destination[0].checked == true) { document.myform.action ="pg1.php"; } else if(document.myform.destination[1].checked == true) { document.myform.action ="pg2.php"; } return true; } </script> <form name="myform" onsubmit="return OnSubmitForm();"> name: <input type="text" name="name"><br> email: <input type="text" name="email"><br> <input type="radio" name="destination" value="1" checked>go to page 1<br> <input type="radio" name="destination" value="2">go to page 2 <p> <input type="submit" name="submit" value="go"> </p> </form> This works fine inasmuch as it takes the visitor to the correct page, however I'd like to store the name entered as a session variable and reuse it on page 1 (or page 2). page1.php looks like this (and page 2 is very similar): Code: <?php session_start(); // debug - turn on error reporting error_reporting(E_ALL | E_NOTICE); ini_set('display_errors', '1'); //Store our posted values in a session variable if (isset ($_POST['name'])) { $_SESSION['name'] = $_POST['name']; } else { $_SESSION['name'] = null; } echo ("Session variable is set to: ".$_SESSION['name']); ?> <h1>welcome to page 1</h1> I'm sure that pg1.php would work if I had used a form action but I need the ability to send the visitor to different pages on form submission Is it possible to write the name to a session variable in try.php (I guess using javascript/ajax)? Thanks for any hints and examples Nigel I can get this code to take two separate sections of a file which are not beside each other and write them into another file. It always comes up as a single full line of the code instead of the sections I want. The code includes the student number first name last name and three results of assignments. I want the code to write the student number and three results of all the students into a file and then work out the average of the student results. Can you help? Code: try{ while (in.hasNextLine()) { String line = in.nextLine(); out.println( line); int i=0; if(!Character.isDigit(line.charAt(i))) { i++; } studentStringNumber = line.substring(0, i); String stringResult = line.substring(i); studentStringNumber = studentStringNumber.trim(); stringResults = stringResults.trim(); double stringResultsValue = Double.parseDouble(stringResults.trim()); stringResults = in.nextLine(); studentStringNumber = in.nextLine(); studentNumber = Integer.parseInt(studentStringNumber); if(in.hasNextInt()) { int value = in.nextInt(); } results = Double.parseDouble(stringResults); if(in.hasNextDouble()) { double value = in.nextDouble(); } Scanner lineScanner = new Scanner(line); studentStringNumber = lineScanner.next(); while(!lineScanner.hasNextDouble()) { studentStringNumber = studentStringNumber+ " " +lineScanner.next(); } stringResultsValue = lineScanner.nextDouble(); } } HI, i know very little about javascript, just enough to get me into trouble actually lol. Here is what im working with. I have a custom Instant messenger for members. It uses embed object macromedia as well as javascript to diplay the window and send messages. What i want to do is simply add an onchange that when one person is typing it shows they are typing (ie xxxxx is typing....) My experience is in php and html and i looked thru the script and the javascript functions but im not sure what im looking for exactly. Do i need to have access to the swf or fla file and be able to edit them to do this? I dont see any form inputs or i would know exactly where to put the onchange lol. Im guessing the input is in the swf or fla file not sure how that works. what im guessing is that in the embed or the object tags (ill play with it) i can put something like Code: document.write('test on change\n'); i think i need to wrap that in doc write script type=javascript in quotes so it parses. If i can get that text to show up inside the IM where i want it then i can try to figure out how to set focus on box and recongize onchange and do some testing. I think i might even be able to doc write the onchange command but not sure. Thanks Please can someone explain to me in simple terms which this actually does. From what I understand it will check all events until a defined event happens, such as rollover of a certain image, and then it activates a function? What I want to do is use this so that when I rollover a element such as below: Code: <img src="img url" alt="this is a tooltip" tooltip="true" /> I want it to pass the obj to a function which then runs, and then once the mouse of not over that element it will activate another function passing the previous object to this function. Although an element such as the example below would not activate these functions: Code: <img src="img url" alt="this is a tooltip"/> As the tooltip tag does not exist or has the value of false... Also, wouldn't this use a lot of resources as it checks every event which the mouse passes over? Hi, I am trying to copy the value of one textbox to another using onchange event. For some reason, my code does not work, please let me know where I went wrong. here is my code: Code: <html> <head> <script type="text/javascript"> function copyText() { document.getElementById("field2").value=document.getElementById("field1").value; } </script> </head> <body> Field1: <input type="text" id="field1"/><br /> Field2: <input type="text" id="field2" onchange="copyText()"/> </body> </html> Thank you. Dammit, for some reason this script has stopped working :/ When I click the links with the ID's of "login_dialog" and "register_dialog" a div should be shown... I'm using an event listener to do this. Code: function listener_items() { //Text field background addEvent(document.getElementById('input_username'), "click", add_username_password); addEvent(document.getElementById('input_username'), "blur", remove_username_password); addEvent(document.getElementById('input_password'), "click", add_username_password); addEvent(document.getElementById('input_password'), "blur", remove_username_password); //Switch between forms addEvent(document.getElementById('dialog_login'), "click", login_dialog_login); addEvent(document.getElementById('dialog_register'), "click", login_dialog_register); addEvent(document.getElementById('dialog_recovery'), "click", login_dialog_recovery); //Display Dialog addEvent(document.getElementById('login_dialog'), "click", navbar_login); addEvent(document.getElementById('register_dialog'), "click", navbar_register); //Close Dialog addEvent(document.getElementById('close_dialog'), "click", login_dialog_close); } //Login dialog, login form input fields background text var add_username_password = function() { add_input_text(this); }; var remove_username_password = function() { remove_input_text(this); }; //Login dialog buttons var login_dialog_login = function() { display_form('login'); }; var login_dialog_register = function() { display_form('register'); }; var login_dialog_recovery = function() { display_form('recovery'); }; //Close dialog var login_dialog_close = function() { display_dialog('login', 'hidden'); }; //Navigation bar buttons var navbar_login = function() { display_dialog('login', 'visible'); }; var navbar_register = function() { display_dialog('register', 'visible'); }; //This function attaches events to elements. var addEvent = function( elm, evt, fun ) { if ( elm.addEventListener ) { elm.addEventListener( evt, fun, false ); } else if ( elm.attachEvent ) { elm.attachEvent( 'on' + evt, fun ); } else { elm [ 'on' + evt ] = fun; } }; addEvent ( window, "load", listener_items ); //Display/Hide login dialog function display_dialog(dialog, fun) { //Define the active menu item style var active_style = "border-right-width:3px; width:113px; border-right-color:#33CCFF; color:#FFFFFF;"; //Creat array with all forms var formsHide = Array("login","register","recovery"); var i = 0; document.getElementById('wrapper').setAttribute('style', 'visibility:' + fun); for ( i = 0; i < formsHide.length; i++ ) { if ( formsHide[i] == dialog && fun == 'visible' ); document.getElementById("dialog_" + dialog).setAttribute('style', active_style); document.getElementById(formsHide[i] + "_form").setAttribute('style', 'visibility:visible'); formsHide.splice(i, 1); } document.getElementById(formsHide[i] + "_form").setAttribute('style', 'visibility:hidden'); } } //Put text in fields if there is not data, also switch text field to password field //when focused on. Switch back to text field if no text is entered. function add_input_text(obj) { var id = obj.id.split("input_"); document.getElementById(id[1]).innerHTML = ''; } function remove_input_text(obj) { if (obj.value.length == 0) { var id = obj.id.split("input_"); var id2 = id[1].substr(0, 1).toUpperCase() + id[1].substr(1); document.getElementById(id[1]).innerHTML = id2; } } function display_form(form) { //Define the active menu item style var active_style = "border-right-width:3px; width:113px; border-right-color:#33CCFF; color:#FFFFFF;"; var forms = Array("login", "register", "recovery"); for ( c = 0; c < forms.length; c++ ) { if ( forms[c] == form ) { document.getElementById( forms[c] + "_form" ).style.visibility = "visible"; document.getElementById("dialog_" + forms[c]).setAttribute('style', active_style); document.getElementById("dialog_" + forms[c]).setAttribute('class', 'overlay_table' + ' ' + forms[c] + ' active'); forms.splice(c, 1); } } for ( c = 0; c < forms.length; c++ ) { document.getElementById("dialog_" + forms[c]).setAttribute('style', '') document.getElementById( forms[c] + "_form" ).style.visibility = "hidden"; document.getElementById("dialog_" + forms[c]).setAttribute('class', 'overlay_table' + ' ' + forms[c]); } } HTML: Code: <span><a href="#" id="login_dialog" style="color:#33CCFF;">Login</a></span> <span><a href="#" id="register_dialog" >Register</a></span> |