JavaScript - Make First Character In Textbox Invisible?
I have a text input field that was created with JS on a screen. The input is padded with a 0 for the first character to work with the server. I was wondering if there is any way to make that 0 invisible so the user doesn't get confused?
Similar TutorialsMade a topic earlier about "auto klick" for swf button but i got response ,its not posible todo that.. so i have another question!! Is it posible to make the swf button invisible but still clickable and then have a background so it looks like its another button? or is there any other way to edit design for the button! OBS! i only have the swf not the flv file! Code: <html class="no-js" lang="en" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml"> <!--<![endif]--> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <script src="http://www.google.com/jsapi?key=ABQIAAAAAJ5I0tmbz-jcO3Ja4fwvEBTb9u7IFi28hLXI-qXjI6UBBcarTBQ49g-wp7Wxnow1_w9F-7_GcOOnyg"></script> <script> google.load("jquery", "1.7.0"); google.load("swfobject", "2.2"); </script> </head> <body> <div id="container"> <div id="main" role="main"> <div id="data" class="channel"> <div id="openbutton"> <div id="flashcontent1";></div> <!-- DR1 Start --><script> params = {}; params.text = 'DR1'; params.action = "channel"; params.value = "40"; swfobject.embedSWF('content/linkbutton.swf', 'flashcontent1', '145', '30', '9.0.115', 'content/expressinstall.swf', params, {allowFullscreen:'true', wmode: 'transparent' ,bgcolor: '#FFFFFF', menu: 'false'}, {id: 'flashcontent1'}); <!-- DR1 Ends --></script> </div></div></div> </div></body></html> Hi I discovered something weird that happend to me when trying to add a javascript created table to the document.body. Basically it doesn't add it in IE, but works fine in FF. Actually it does add it in IE, but only shows up if I add a <br/> later in a new statement... What?!?! try my code to see what is going on. (works fine in FF, does bad thing in IE) I tried to narrow the code i was working with down to basics and still have the glitch happen so maybe it's just something wrong with this code, but i couldn't pinpoint it. Also, it's only when i do document.body.appendChild(), not document.body.innerHTML += entireMassiveElement.innerHTML; I need it to work in both browsers with the appendChild() method, because innerHTML is much slower. Any advice appreciated! Thanks! 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> <title>Interace v1.0</title> <style type="text/css"> /****************** * --Panel Style ******************/ .panel { } .panel table td {padding: 0px;} .panel_corner { background-color: #00c0ff; background-repeat: no-repeat; width: 3px; height: 3px; } .panel_sideX {height: 3px; background-color: #00c0ff; background-repeat: repeat-x;} .panel_sideY {width: 3px; background-color: #00c0ff; background-repeat: repeat-y;} .panel_topLeft {background-position: 0px 0px;} .panel_topRight {background-position: -3px 0px;} .panel_bottomLeft {background-position: -0px -3px;} .panel_bottomRight {background-position: -3px -3px;} .panel_top {background-position: -3px -6px;} .panel_right {background-position: -3px 0px;} .panel_left {background-position: 0px 0px;} .panel_bottom {background-position: -3px -9px;} .panel_main { background-color: #00c0ff; } .panel_titlebar { color: #ffffff; font-family: verdana; font-size: 10pt; padding: 3px; padding-top: 0px; overflow: hidden; /* display: none; */ } .panel_title { float: left; height: 18px; overflow: hidden; } .panel_buttons { float: right; } .panel_toolbar { background-color: #444444; color: #eeeeee; font-family: verdana; font-size: 10pt; padding: 3px; overflow: hidden; display: none; } .panel_content { overflow: auto; font-family: arial; color: #eeeeee; font-size: 7pt; font-weight: bold; padding: 10px; border: 1px inset #cccccc; background-color: #444444; } </style> <!--///////////////////////////////////--> <script type="text/javascript"> function makeElement() { var layout = document.createElement("table"); //the table that is the basic layout var top = document.createElement("tr"); var tl = document.createElement("td"); top.appendChild(tl); var tc = document.createElement("td"); top.appendChild(tc); var tr = document.createElement("td"); top.appendChild(tr); var middle = document.createElement("tr"); var ml = document.createElement("td"); middle.appendChild(ml); var mc = document.createElement("td"); middle.appendChild(mc); var mr = document.createElement("td"); middle.appendChild(mr); var bottom = document.createElement("tr"); var bl = document.createElement("td"); bottom.appendChild(bl); var bc = document.createElement("td"); bottom.appendChild(bc); var br = document.createElement("td"); bottom.appendChild(br); layout.appendChild(top); layout.appendChild(middle); layout.appendChild(bottom); layout.style.borderCollapse = "collapse"; tl.className = "panel_corner panel_topLeft"; tc.className = "panel_sideX panel_top"; tr.className = "panel_corner panel_topRight"; tl.style.padding = "0px"; tc.style.padding = "0px"; tr.style.padding = "0px"; ml.className = "panel_sideY panel_left"; mc.className = ""; mr.className = "panel_sideY panel_right"; ml.style.padding = "0px"; mc.style.padding = "0px"; mr.style.padding = "0px"; bl.className = "panel_corner panel_bottomLeft"; bc.className = "panel_sideX panel_bottom"; br.className = "panel_corner panel_bottomRight"; bl.style.padding = "0px"; bc.style.padding = "0px"; br.style.padding = "0px"; //-- Set up the cursors for the bottom, right, and bottomright sides to resize mr.style.cursor = "e-resize"; bc.style.cursor = "s-resize"; // --Now create the internal structure, titlebar, toolbar, content area var main = document.createElement("div"); var titlebar = document.createElement("div"); var toolbar = document.createElement("div"); var content = document.createElement("div"); content.innerHTML = "success!"; main.appendChild(titlebar); main.appendChild(toolbar); main.appendChild(content); mc.appendChild(main); main.className = "panel_main"; titlebar.className = "panel_titlebar"; toolbar.className = "panel_toolbar"; content.className = "panel_content"; //-- create the titlebar internals, title, buttons, cleardiv var title = document.createElement("div"); var buttons = document.createElement("div"); var clear = document.createElement("div"); titlebar.appendChild(title); titlebar.appendChild(buttons); titlebar.appendChild(clear); clear.style.clear = "both"; title.className = "panel_title"; buttons.className = "panel_buttons"; main.style.width = "200px"; return layout; } function go(select) { var stuff = makeElement(); if(select == 1) { //-- Add everything to the container document.body.appendChild(stuff); } else if (select == 2) { //-- Add everything to the container //layout is a table, but innerHTML only returns the inner, so i just added on the outer tags. document.body.innerHTML += ('<table cellpadding="0" cellspacing="0">' + stuff.innerHTML + '</table>'); } //document.body.innerHTML += "<br/>"; } </script> </head> <body> <input type="button" value="test append Element" onclick="go(1);"/><input type="button" value="test innerHTML add" onclick="go(2);"/> <body> </html> On various video sites you can click cinema mode and the page goes dark, whilst you watch the video. On my page I have a box which appears, where the user enters their name and email address. But I would like the box to remain active and in view. While the rest of the page goes darker and unusable, Like on the video player websites How do I do this? Hi.. I have form and i want to input data using barcode and it will display on textbox and after input on the first textbox the focus will go to next textbox untill it will go on the last textbox and on the last textbox it will automatically save the data's on the database. How is it possible? here is my sample code: Code: <?php error_reporting(0); date_default_timezone_set("Asia/Singapore"); //set the time zone $con = mysql_connect('localhost', 'root',''); if (!$con) { echo 'failed'; die(); } mysql_select_db("mes", $con); ?> <html> <head> <script type="text/javascript"> function ini() { // Retrieve the code var code =document.getElementById ("code_read_box1").value; var code =document.getElementById ("code_read_box2").value; var code =document.getElementById ("code_read_box3").value; var code =document.getElementById ("code_read_box4").value; var code =document.getElementById ("code_read_box5").value; var code =document.getElementById ("code_read_box6").value; // Return false to prevent the form to submit return false; } </script> </head> <body onLoad="document.barcode.code_read_box1.focus()"> <form name=barcode onsubmit = "return ini()"> <input type="text" id="code_read_box1" value="" /><br/> <input type="text" id="code_read_box2" value="" /><br/> <input type="text" id="code_read_box3" value="" /><br/> <input type="text" id="code_read_box4" value="" /><br/> <input type="text" id="code_read_box5" value="" /><br/> <input type="text" id="code_read_box6" value="" /><br/> </form> </body> </html> Hello. I've been teaching myself HTML and CSS for a while, and now I've moved into the world of Javascript (but I'm still very much a beginner). For practice, I've been building a sample sign up form for a mock website, and I'm having problems with the birthdate section. The idea I had was to have MM, DD, and YYYY be the default values of my 3 textboxes (as an example for users), then set the value to nothing when the box gained focus. That all works fine, but I ran into problems when I tried to write an if statement to set the value back to MM, DD, or YYYY if the value was still nothing when the user clicked away. As it is now it just replaces the text inputted into the textbox (which of course is not good). Any ideas for what the problem might be? Code: <form name="signup" action="javascript:void(0);" method="post"> <table> <tr> <td>Date Of Birth:</td> <td> <input name="DOBmonth" type="text" value="MM" size="2" style="color: #555555;" onFocus="clearDOBmonth()" onBlur="restoreDOBmonth()" /> <input name="DOBday" type="text" value="DD" size="2" style="color: #555555;" onFocus="clearDOBday()" /> <input name="DOByear" type="text" value="YYYY" size="4" style="color: #555555;" onFocus="clearDOByear()" /></td> </tr> <tr> <td></td> <td><button name="Submit" type="submit" style="font-size: 1em;">Sign Up</button></td> </tr> </table> </form> <script type="text/javascript" language="javascript"> <!-- document.signup.DOBmonth.value="MM"; document.signup.DOBday.value="DD"; document.signup.DOByear.value="YYYY"; function clearDOBmonth() { document.signup.DOBmonth.value="";} function clearDOBday() { document.signup.DOBday.value="";} function clearDOByear() { document.signup.DOByear.value="";} function restoreDOBmonth() { if ('document.signup.DOBmonth.value = ""') { document.signup.DOBmonth.value = "MM"; // alert(document.signup.DOBmonth.value); } } //--> </script> Another side question, if I set a variable equal to the value of a textbox, then change the value of the variable, does that also change the value of the textbox? or is the variable no longer associated with the textbox. Example: Code: var a = document.form.textbox.value; a = blue; does document.form.textbox.value = blue? or is var a now completely independent of the textbox value? Thanks! Hi everyone. I'm new to the forum, and in need of help. The code below sometimes works the way I want it to...by downloading a video from an external site and displaying a placeholder whenever the page loads. But most of the time, the video won't download and display until a user hovers their mouse over the blank area. Is it possible to modify the code so that it functions consistently by always downloading and displaying the placeholder when the page loads? I don't want users to think there's a missing/broken video because there's a blank space where the video is supposed to be, and they don't realize they have to mouse over it. I would be grateful for any pointers. I searched the forums for a solution, but I don't think I'm using the correct keywords. Thanks so much for your help. Code: <a href="#" onclick="return(false);" rel="videoGUID=4cd75af679b39g4963V828c00c581024ae86&" style="display: block; width: 550px; height: 310px" id="4cd75af679b39g4963V828c00c581024ae86" width="550" height="310">How to Take Care of Your Dog's Teeth: VetVid Episode 001</a><script type="text/javascript" src="http://360.sorensonmedia.com/4cd75af679b39g4963V828c00c581024ae86/embedv2.js"></script> Hi, I am going to open a new window on my web page , and run one link (which is important for me to be run ), then close that window after some seconds, but I do not want this window be visible by users. This is the code I used, but when I add visible= none, the function does not work, and my link cannot be run. <button onclick="myFunction()">Click</button> <script type="text/javascript"> function myFunction() { var win = window.open("link", '1366002941508','width=x,height=y,left=xx,top=yy', visible=none); setTimeout(function () { win.close();}, ss); } </script> I really appreciate for your suggestion ) Hello, I need your help. I would like to insert a few blank spaces in a text string: eg. string = 123456(space)(space)(space)7891011 How do you do this? Thanks a bunch Jay I am creating a customized home page that can display regular links and login forms. I am adding Gmail login form into it. I can further customize it by putting multiple sign in buttons that can fill in username/password for different accounts before submitting. Here's the preview: http://imgur.com/s4Ert.jpg Now the problem is, in Gmail login form a hidden variable called "dsh" is filled with a value that is matched with server as well as a cookie, this value changes in some hours. So this means that I cannot create a complete offline form, but is it possible to load the login page hidden, and catch the value from it? I tried with an iframe with display:none and src="http://mail.google.com" but it opened in the top frame. Any other ideas? In short, what we need is, every time a page is opened from my computer, an online page should be open invisible from the user, and a hidden form value is to be fetched from it. Hello everyone. I'm new to programming, although I've learned HTML and CSS pretty thoroughly. I think I have most of the Javascript basics down as far as definitions, but I'm getting hung up on the actual coding. I'm working on an information request form for my fiancee's business site. In it, I want to have options that users select via radio buttons. Rather than having additional input fields static on the page, I would like to program some of the radios, when clicked, to open a previously unseen option where users will then be able to type in the necessary information. More specifically, since she only works in two states, I want a third option of "other," which, when opened, will allow the user to input any other state. Then, should the radio be deselected or reset, the field would disappear again. If my understanding is correct, I think I will need to use a javascript function in the header, an HTML "div" section with ID, "onclick" and "offclick" events in the button mark-up, and the specific javascript code to call the function (getElementById?). Or maybe I'm way off. Please help. Thanks Hi all, I cant get this code to work because I do not know how to include the % character. Any help would be appreciated. My line break isnt working either Cheers, Adrian Code: rightButton.innerHTML = (rightOutcome1Prob+" chance of "+rightOutcome1+"\r\n else "+rightOutcome2); Hello all, I need assistance checking for valid characters in a username/password set up. I have been reading up on form validation but can't find exactly what I am looking for and need help deciphering what's going on. I have a list of accepted characters: "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789.-_@" a-z, A-Z, 0-9, dot, dash, underscore, and at. I want to then check an inputed string against that set and if a character is notin the accepted set, to send an alert. Here is what I have gathered so far: a for loop that increments through the values' .length - this is what checks each individual character. Then use of indexOf() can tell me which character is unacceptable. Now is where I am stuck and coming to you. Please help Hi Im new to javascript and need some help with a project I have, the task I have is: Create a page that can take a bloke of text and out put the following o How many times each letter occurs o How many spaces o How many words o How many times each word occurs o A list of things that are not words or special characters I think maybe use an array but im not sure, like I said im new to this so not too sure on how to do it. I know it would read into a file say a txt file and sort through it this way, possibly using some kind of loop to read through all of the text before sorting it and I know it might use variables. I know how to kind of work through the task I have, but to actually implement the mechanics of the javascript is something that I then struggle with Thanks to all that help. Specifically i was wondering if anyone had any ideas on how to select the specific character when hovering over a word? I have not been able to find any documentation on this however, there is a demo site i found for a plugin that allows character selection. http://labs.bitmeister.jp/moamoa/demo.html i dont need anything that large and elaborate... Edit I'm pretty wel experinced with jquery, I know it's possible with jquery So say if my string was.. Code: a = "Hello"; alert(a); How do I get it to say; Code: alert("ello"); So how do I take off the 'H' in this example.. Hey Guys, I wanted to prepend a character to menu items when the mouse will hove over them. An example of this is seen on the website of Minivegas, he http://minivegas.net/ When you hover over a menu item at the top a slash appears in front. There seems to happen a couple of things to smoothen out the effect of prepending the character. I was looking for a similarly smooth way of adding a character in front of my menu items. Can anybody help me out on how to do this? I'm also unable to find out exactly how they did it on the Minivegas website. Anybody any ideas? Thanks in advance! Regards, Roy H, I'm trying to create an sms form. but I want the users to be able to monitor the characters and sms number as they type...taking 160 characters to be 1 page. pls I'll need help with coding this form to display characters left in 'ch_count' box and number of pages in the 'pages' box while typing in the 'message' textarea....hope it's clear enough...thanks Code: <p> <textarea name="message" cols="" rows="" id="message"></textarea> </p> <p> <input name="ch_count" type="text" id="ch_count" size="8" /> characters left <input name="pages" type="text" id="pages" size="8" /> pages </p> Ok I have a textarea field that is validated by Js, this textarea can and will contain the newline character Code: \n so I validate in JS Code: if(textareaname.value.length < 200) this hten goes through to my php where i also check before I place in to the Database using MYSQL Code: if( strlen($_POST['textareaname']) < 200 ) but my php is giving me a different string length from my javascript. It looks as if Javascript is counting a newline as 1 character and php is treating it as 2. I have checked my slashes, I have used various REgex to check these data amounts. I have also Googled around and there doesnt seem much around. Any ideas? Any suggestions as to how I can make php and javascript treat a newline as the same amount of characters? Thanks in advance. Hi i need a little help on a JavaScript program it ask the user for a keyboard character and a number of rows and columns to look like this RRRRR R___R R___R R___R RRRRR and also this in another program rrrrrr rrrrrr rrrrrr rrrrrr I currently have <html><body> <script type="text/javascript"> // Declare variables and constants var userInputText; // user input to go var numRow; // number of the rows var NumCol; // number of the columns var ES = ""; // empty string userInputText = prompt("Enter a keyboard character",ES); numRow = prompt("Enter the number of rows",ES); NumCol = prompt("Enter the number of columns",ES); //need a nested loop to draw the character box </script> </body> </html> if any one can help me finish this program i would appreciate it |