JavaScript - Keypress Capitalize Function Broken In Ie9
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? Similar TutorialsHi All, I am working on a script that creates a table, taking the data from a number of text fields and populating the table cells with it. Originally I had to start with an existing table containing one blank row but I was able to get the script to create the table dynamically. Unfortunately I seem to have broken my delete row function (this was working fine when the script started with an existing table). The error I am getting is: TypeError: 'cells.0.childNodes' is null or not an object I googled this but could not find anything to help. I don't have alot of javascript experience and need help from the experts. Thanks in advance for all your help guys! Kind regards, Ken 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>Untitled Document</title> <script src="SpryAssets/SpryValidationTextField.js" type="text/javascript"></script> </style> <link href="SpryAssets/SpryValidationTextField.css" rel="stylesheet" type="text/css" /> </head> <SCRIPT language="javascript"> function addRow(tableID) { if (!document.getElementById(tableID)) { //alert("the table does not exist"); var body = document.getElementsByTagName("body")[0]; // creates a <table> element and a <tbody> element var tbl = document.createElement("table"); var tblBody = document.createElement("tbody"); var newRow = document.createElement("tr"); // add the row to the end of the table body tblBody.appendChild(newRow); // put the <tbody> in the <table> tbl.appendChild(tblBody); // appends <table> into <body> body.appendChild(tbl); // sets the id of "dataTable" and border attribute of tbl to 0; tbl.setAttribute("id", "dataTable"); tbl.setAttribute("border", "0"); } var StartTime = document.getElementById('StartTime'); var EndTime = document.getElementById('EndTime'); var MaterialID = document.getElementById('MaterialID'); var Title = document.getElementById('Title'); var table = document.getElementById(tableID); var rowCount = table.rows.length; var row = table.insertRow(rowCount); var cell1 = row.insertCell(0); var element1 = document.createElement("input"); element1.type = "checkbox"; cell1.appendChild(element1); var cell2 = row.insertCell(1); var element2 = document.createElement("input"); element2.type = "text"; element2.setAttribute("name","StartTime[]"); element2.value = StartTime.value; cell2.appendChild(element2); StartTime.value=""; var cell3 = row.insertCell(2); var element3 = document.createElement("input"); element3.type = "text"; element3.setAttribute("name","EndTime[]"); element3.value = EndTime.value; cell3.appendChild(element3); EndTime.value=""; var cell4 = row.insertCell(3); var element4 = document.createElement("input"); element4.type = "text"; element4.setAttribute("name","MaterialID[]"); element4.value = MaterialID.value; cell4.appendChild(element4); MaterialID.value=""; var cell5 = row.insertCell(4); var element5 = document.createElement("input"); element5.type = "text"; element5.setAttribute("name","Title[]"); element5.value = Title.value; cell5.appendChild(element5); Title.value=""; } function deleteRow(tableID) { if (document.getElementById(tableID)) { //alert("the table exists"); try { var table = document.getElementById(tableID); var rowCount = table.rows.length; for(var i=0; i<rowCount; i++) { var row = table.rows[i]; var chkbox = row.cells[0].childNodes[0]; if(null != chkbox && true == chkbox.checked) { table.deleteRow(i); rowCount--; i--; } } }catch(e) { alert(e); } } } </SCRIPT> <body> <span id="spryStartTime"> <label for="StartTime">Start Time:</label><br /> <input name="StartTime" type="text" id="StartTime" tabindex="1" size="10" maxlength="8" /> <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span><br /> <label for="EndTime">End Time:</label><br /> <span id="spryEndTime"> <input name="EndTime" type="text" id="EndTime" tabindex="2" size="10" maxlength="8" /> <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span><br /> <label for="MaterialID">Material ID:</label><br /> <span id="spryMaterialID"> <input name="MaterialID" type="text" id="MaterialID" tabindex="3" size="10" maxlength="10" /> <span class="textfieldRequiredMsg">A value is required.</span></span><br /> <label for="Title">Title:</label><br /> <span id="spryTitle"> <input name="Title" type="text" id="Title" tabindex="4" size="50" maxlength="50" /> <span class="textfieldRequiredMsg">A value is required.</span></span><br /> <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /> <INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" /> <script type="text/javascript" /> var sprytextfield3 = new Spry.Widget.ValidationTextField("spryStartTime", "time", {validateOn:["blur"], format:"HH:mm:ss", useCharacterMasking:true}); var sprytextfield4 = new Spry.Widget.ValidationTextField("spryEndTime", "time", {format:"HH:mm:ss", useCharacterMasking:true, validateOn:["blur"]}); var sprytextfield5 = new Spry.Widget.ValidationTextField("spryMaterialID", "none", {validateOn:["blur"]}); var sprytextfield6 = new Spry.Widget.ValidationTextField("spryTitle", "none", {validateOn:["blur"]}); </script> </body> </html> 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 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 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? 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! 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! I need to assign a key in the javascript to actually make the javascript work,. I have a bookmark in chrome , a javascript , which actually works when clicked on it .,. but how can i edit it so that i can actually make it work on click a key or combination of keys. i want to declare the key or keycombo in the script itself .,. the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,., So I want it to work it this way ., select the text press a key and it opens a new tab (or window) with an xact search .,. i want to declare the key or keycombo in the script itself .,. the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,., So I want it to work it this way ., select the text press a key and it opens a new tab (or window) with an xact search .,. Thanks in advance ., Nani Code: <body> <center> <script type="text/javascript"> var imageSrc = ['<img www.mysite.com/subfolder/001.jpg></img>','002.jpg','003.jpg', '004.jpg','005.jpg','006.jpg']; var imageSrc2 = [];; function copyRandom(){ if (0 == imageSrc2.length) { imageSrc2 = imageSrc.concat(); } var randNum = (Math.random()*imageSrc2.length) | 0; return imageSrc2.splice(randNum, 1); } </script> <!-- <button onclick="document.getElementById('xx').innerHTML = (copyRandom());"> --> <button onclick="document.getElementById('xx').innerHTML = (copyRandom());"> Draw A Card </button> <div id="xx"></div> <!-- <div id="xx"></div> --> </center> </body> Why are my images broken in this script? Specifically "<img www.mysite.com/subfolder/001.jpg></img>" as the rest are just placeholders until I solve the first one. The latest version of MSIE fails to read the value of a popup menu in a form that I have. It worked fine in a previous version, and works in Firefox and Mac Safari. Here is an edited version of what I have: Code: var d = null; function myTest(){ alert("mWunits value = ".concat(d.mWunits.value)) } . . . <body onload="d = document.forms[0];"> . . . <form onsubmit="return false" > <table align="center" border="0"> <tbody> <tr> <td align="right">Conductor Size (d):</td> <td><input name="ef_dw" size="12"> </td> <td align="left"> <select name="mWunits" size="1"> <option selected="selected">mm</option> <option>AWG</option> </select> </td> </tr> . . . The popup name is mWunits, and should have either "AWG" or "mm" as a value. And the function myTest() should display that value. However the value is an empty string. There is another popup in the same form, and it exhibits the same problem. My script reads the values of regular input fields just fine. As I said, this used to work under earlier MSIE versions, and works in other browsers. Has something been deprecated that I don't know about? I've got a style control for my website where the user can select text color and background color. Cookies then remember the selections. The problem I have is when you select a text color the background color is changed instead of the text color. After page refresh both the text and background colors are correct. The error console reports a few errors in each js script. The errors all say 'sel is undefined' on line 7. html: Code: <!DOCTYPE html> <html lang="en"> <head> <title>Style Control</title> </head> <body> <p><b>Style Control</b></p> <p>Text color: (Broke - Sets bg color insted, works after page refresh)</p> <form onsubmit="return false;" action=""> <script type="text/javascript" language="JavaScript" src="text_color.js"></script> <select name="color_select1" size="1" onchange="return setColor(this, global_name1)"> <option style="background-color: white;" value="white">white</option> <option style="background-color: black; color: white;" value="black">black</option> <option style="background-color: seagreen;" value="seagreen">seagreen</option> <option style="background-color: springgreen;" value="springgreen">springgreen</option> <option style="background-color: royalblue;" value="royalblue">royalblue</option> <option style="background-color: skyblue;" value="skyblue">skyblue</option> </select> </form> <br /><br /> <p>Background color:</p> <form onsubmit="return false;" action=""> <script type="text/javascript" language="JavaScript" src="bg_color.js"></script> <select name="color_select2" size="1" onchange="return setColor(this, global_name2)"> <option style="background-color: white;" value="white">white</option> <option style="background-color: black; color: white;" value="black">black</option> <option style="background-color: seagreen;" value="seagreen">seagreen</option> <option style="background-color: springgreen;" value="springgreen">springgreen</option> <option style="background-color: royalblue;" value="royalblue">royalblue</option> <option style="background-color: skyblue;" value="skyblue">skyblue</option> </select> </form> </body> </html> </body> </html> text_color.js : Code: var global_name1 = 'tcolor'; // function getColor(sel, cookie_name) { var cookie_value = getCookie(cookie_name); if (!cookie_value) cookie_value = 'black'; document.body.style.color = cookie_value; var opt = sel.options; var x, len = sel.length; for (x=0; x<len; x++) { if (opt[x].value == cookie_value) { opt[x].selected = true; break; } } return true; } getColor(document.forms[0].color_select1, global_name1); // function setColor(sel, cookie_name) { var opt = sel.options[sel.selectedIndex].value; var oneDay = 24 * 60 * 60 * 1000; var oneYear = 365 * oneDay; var expDate = new Date(); expDate.setTime(expDate.getTime() + oneYear); setCookie(cookie_name, opt, expDate); return getColor(sel, cookie_name); } // ---------------------------------------- // function getCookie(name) { var arg = name + "="; var alen = arg.length; var clen = document.cookie.length; var i = 0; while (i < clen) { var j = i + alen; if (document.cookie.substring(i, j) == arg) return getCookieVal (j); i = document.cookie.indexOf(" ", i) + 1; if (i == 0) break; } return null; } function getCookieVal(offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) endstr = document.cookie.length; return unescape(document.cookie.substring(offset, endstr)); } function setCookie(name, value) { var argv = setCookie.arguments; var argc = setCookie.arguments.length; var expires = (argc > 2) ? argv[2] : null; var path = (argc > 3) ? argv[3] : null; var domain = (argc > 4) ? argv[4] : null; var secure = (argc > 5) ? argv[5] : false; document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : ""); } function delCookie(name) { exp = new Date(); exp.setTime(exp.getTime() - (24*60*60*1000)); var cval = getCookie(name); cval = (cval == null) ? "" : cval; document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString(); } bg_color.js : Code: var global_name2 = 'bgcolor'; // function getColor(sel, cookie_name) { var cookie_value = getCookie(cookie_name); if (!cookie_value) cookie_value = 'white'; document.body.style.backgroundColor = cookie_value; var opt = sel.options; var x, len = sel.length; for (x=0; x<len; x++) { if (opt[x].value == cookie_value) { opt[x].selected = true; break; } } return true; } getColor(document.forms[0].color_select2, global_name2); // function setColor(sel, cookie_name) { var opt = sel.options[sel.selectedIndex].value; var oneDay = 24 * 60 * 60 * 1000; var oneYear = 365 * oneDay; var expDate = new Date(); expDate.setTime(expDate.getTime() + oneYear); setCookie(cookie_name, opt, expDate); return getColor(sel, cookie_name); } // ---------------------------------------- // function getCookie(name) { var arg = name + "="; var alen = arg.length; var clen = document.cookie.length; var i = 0; while (i < clen) { var j = i + alen; if (document.cookie.substring(i, j) == arg) return getCookieVal (j); i = document.cookie.indexOf(" ", i) + 1; if (i == 0) break; } return null; } function getCookieVal(offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) endstr = document.cookie.length; return unescape(document.cookie.substring(offset, endstr)); } function setCookie(name, value) { var argv = setCookie.arguments; var argc = setCookie.arguments.length; var expires = (argc > 2) ? argv[2] : null; var path = (argc > 3) ? argv[3] : null; var domain = (argc > 4) ? argv[4] : null; var secure = (argc > 5) ? argv[5] : false; document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : ""); } function delCookie(name) { exp = new Date(); exp.setTime(exp.getTime() - (24*60*60*1000)); var cval = getCookie(name); cval = (cval == null) ? "" : cval; document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString(); } Many thanks for any help. Hey friends, I'm not sure where to post this, so redirect me if there is a more appropriate location, please. I am having a very strange problem with a javascript gallery contained within a site I am working on. The problem is, that it broke (appears to be a non-working javascript) while transferring servers (from test server to client server). It makes me believe that it is a filepath problem, but I have checked over the filepaths, the javascript, the css, the html, substituted the new files back into the test server one by one, which, all work on the test server (and vice versa, the old files dont work on the new server)... and cannot seem to find the problem. I am using noobSlide gallery and have replaced the JS files incase they became corrupted in any way during the transfer. The website is located he http://www.design-evolve.com The gallery is located within Landscape-> Residential Landscape (under the Projects section). Once you reach the Residential Landscape, the Gallery is at the top of the page, and the arrows *should* scroll you through 5 images. Can anyone give me a fresh set of eyes to see if I am overlooking something? Any help would be much appreciated. Thanks, -Andrew Strings,, Broken Links, and Variables --HELP! I have a page with over 600 lines of code that I need to fix, the problem is as such: The page contains about 200 links, the problem is that the link tags are all messed up,, instead of the URL's they all got replaced with xxxxx so instead of: <a href="http://mystore.com/product1">product1</a> it would read: <a href="http://mystore.com/xxxx">product1</a> each product has to link to it's own page .... i.e: product1 goes to /mystore.com/product1,,, and so on I need help writing a script or performing some sort of function, that will take the text in between the <a></a> tags and insert it into it's own tag instead of the xxxxx so it would see <a href="http://mystore.com/xxxx">BaseBall Gloves</a> and convert that line into <a href="http://mystore.com/BaseBall%20Gloves>BaseBall Gloves</a> -- OUTPUTS: the ideal way would be if it could replace the existing source (kind of how you can do a find and replace),, if that's not possible, it would need to output all the existing source code with the modified <a> tags to a new window, and then I can copy that code into a new page. I've tried using regular expressions and different functions but can't get it to work. I really appreciate your help.. Thanks. I have been modifying this form: http://www.kartaway.com.au/form.html to be part of an iPhone optimized site for the same client. The modified form works, however it no longer stops emails being sent that do not have the required fields filled in. The modified form is he http://marketingandbranding.com.au/itest/icontact.html The original is built using a table which I have removed and replaced with divs. Didn't think I'd left anything out which would matter but I guess I must have. Please help, i don't really know any JavaScript except what I copy and paste. I have created a program that works great but sometimes it does not finish. It is the exact same as the one we see in this forum when you want to insert an image into a forum post. The program takes in a users image url through prompt, then regenerates the information within the textbox with [img] tags. The problem is I try to do this once and it will work great, but then I will try it again and fill out all of the information the exact same way and nothing happens. By nothing happens I mean after I hit enter the text box will remain empty with no regenerated code. But if I do a page refresh it works. That leads me to believe there is nothing wrong with my code b/c I do it once and get a sound result, then again and get nothing. Anyone have any experience with broken programs like this before or any words of advice? PHP Code: <script language="javascript"> function imgGenerator(){ var question=confirm("Share a Picture?"); if (question==true){ var obj=document.getElementById("mngl-board-post-input"); var imgurl = prompt('To Share an image paste the image url here \nSupport .jpg .jpeg .gif .bmp and .png'); if (imgurl == "" || imgurl == null) {return false;} var txt=document.createTextNode("[a][img]"+imgurl+"[/img][/a]"); obj.appendChild(txt); } else {} } </script> PHP Code: <a href="javascript:void(0);" onClick="imgGenerator();"><img src="http://instride.org/images/image.png" alt="Share an Image" /></a> Hi Guys, This isn't the first time I've posted about cookies, and I apologize for that. My cookies were working perfectly until I made some changes to the site (ie. ran it through w3 validation). Now they aren't writing. I can't find any bugs with firebug, and I've tried following it through line by line. I expect my email validation is returning false, and I would really appreciate if you can help me find the bug. Here's the code, which I call with onsubmit="return Getvalue()" The rest of the page is at www.saverally.com Code: function echeck(str) { var at="@" var dot="." var lat=str.indexOf(at) var lstr=str.length var ldot=str.indexOf(dot) if (str.indexOf(at)==-1){ return false } if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){ return false } if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){ return false } if (str.indexOf(at,(lat+1))!=-1){ return false } if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){ return false } if (str.indexOf(dot,(lat+2))==-1){ return false } if (str.indexOf(" ")!=-1){ return false } return true } function ValidateForm(emailID){ //var emailID=document.frmSample.txtEmail if ((emailID.value==null)||(emailID.value=="")){ showDialog('Uh-oh.','Our tech-pigeons say you must enter an email address.','success',3); emailID.focus() return false } if (echeck(emailID.value)==false){ emailID.value="" showDialog('Uh-oh.','Our tech-pigeons say you must enter a "proper" email address.','success',3); emailID.focus(); return false } return true } /*Email Validation*/ function Getvalue() { var validation=ValidateForm(document.getElementById("email")); if(validation==true) { user_email=document.getElementById("email").value; createCookie("userEmail",user_email,365); document.addform.submit(); return true; } else { return false; } } </script> Hi, I am facing a problem in passing replace() function as an argument in user defined java function, can any one help me how to resolve it? intention is to pass a file path to my user defined function, but before passing the path i want to replace the character '\' to '\\' I am posting my javascript function he <a href="#" onclick="OpenDocPreview('<%# Eval("PATH")%>'.replace(/\\/g,"\\\\"), '<%# Eval("Filename")%>')"><%# Eval("DocTitle") %></a> function OpenDocPreview(url, docname) { alert('message from search base : ' + url + ' ' + docname); } thank you, I was working on a tutorial for some ajax uploading stuff and I ran across a new function syntax I don't recognize. I am not a Javascript pro, but I am not a newbie either. here is the code I am working on: Code: function handleFileSelect(e){ var files = e.target.files; var output = []; for(var i=0,f;f=files[i];i++){ if(f.type.match('image.*')){ var reader = new FileReader(); reader.onload = (function(theFile){ return function(e){ var span = document.createElement('span'); span.innerHTML = ['<img class="thumb" src="',e.target.result,'" title="',theFile.nbame,'" />'].join(''); document.getElementById('list').insertBefore(span,null); }; })(f); reader.readAsDataURL(f); } } document.getElementById('list').innerHTML = '<ul>'+output.join('')+'</ul>'; } document.getElementById('files').addEventListener('change',handleFileSelect,false); To be a little more clear, the code in question is that is the very middle. The syntax I don't understand is: Code: class.event = (function(arguments){ //stuff you put in a function... })(more Arguments?); I tried to customize a simple one to learn for myself and I wrote this: Code: var a = 'A'; var b = 'B'; test = (function(t){ alert(t); alert(b); })(b); test(a); The browser would alert 'B' and that's it. The console would tell me that 'test is not a function.' OK, so I am confused. The topmost code works. What I am wondering is what the syntax is called for creating a function (or event listener?) that way, and how it works. Although if I new what it was called I could just google how it works. |