Mac
Mac

Reputation: 7533

how to hide text in an html textbox

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>

Upvotes: 3

Views: 27191

Answers (5)

javed iqbal
javed iqbal

Reputation: 35

Just give color property as trasparent to the element i.e. to the Input in your case.

Upvotes: 0

nyn3x
nyn3x

Reputation: 919

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.

Upvotes: 2

Chase Wilson
Chase Wilson

Reputation: 1487

For a Password protected field please just use the "password" type.

<input type="password" size="25" />

Upvotes: 1

Brian S
Brian S

Reputation: 5056

It looks like you're trying to make a homebrew password field? It would be much simpler to just use <input type="password" ...> instead.

Upvotes: 1

kander
kander

Reputation: 4286

Mac,

What you're doing is kind-of impossible to accomplish 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:

  1. Make the textcolor the same as the background color.
  2. 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 accomplish 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).

Upvotes: 4

Related Questions