i am having a simple html text box what i want just as the user type something in it the text should be invisible but the text should be there
<html>
<head>
<title>My Page</title>
<script type="text/javascript">
function hide()
{
document.forms["text"].style.visibility = 'hidden';
}
</script>
</head>
<body>
<form name="myform">
<div align="center">
<input type="text" size="25" onkeyup="return hide();">
</div>
</form>
</body>
</html>
i am having a simple html text box what i want just as the user type something in it the text should be invisible but the text should be there
<html>
<head>
<title>My Page</title>
<script type="text/javascript">
function hide()
{
document.forms["text"].style.visibility = 'hidden';
}
</script>
</head>
<body>
<form name="myform">
<div align="center">
<input type="text" size="25" onkeyup="return hide();">
</div>
</form>
</body>
</html>
- i have written the code what iam doing in the code block but it is not showing – Mac Commented Jul 24, 2010 at 6:38
- Your question makes no sense. – Chase Wilson Commented Jul 24, 2010 at 6:39
- @chase can i ask why? iam having a name field and password field i just want to hide the password text – Mac Commented Jul 24, 2010 at 6:41
- set the type of the field to password <input type="password" />, The way you're suggesting maintains visibility to the code, just not to the eyes. – Chase Wilson Commented Jul 24, 2010 at 6:44
5 Answers
Reset to default 4Mac,
What you're doing is kind-of impossible to acplish using straightforward means. When you use the code you've included in the question, you're actually removing the visibility of the entire box, not just the text content.
Some ideas:
- Make the textcolor the same as the background color.
- Use the onKeyPress event, after every keystroke take the value from this box, and append it into a hidden textbox you've got elsewhere on the page (or a javascript variable.
Combining these should be pretty effective in what you're tryin to do.
More important is the question: Why would you want to do this? Could you elaborate on what it is you're trying to acplish here?
Edit: I see you're doing this for passwords. In that case, why not use the <input type="password"> field? That way the browser know it's a password field and hides the input automatically (using the standard dots, or stars).
instead of setting visibility="hidden" try display="none"
Edit: didn't noticed it's about passwords - in this case you should use type=password for the input element.
It looks like you're trying to make a homebrew password field? It would be much simpler to just use <input type="password" ...> instead.
For a Password protected field please just use the "password" type.
<input type="password" size="25" />
Just give color property as trasparent to the element i.e. to the Input in your case.