disappearing form hits?

Question

i dont know even how this is name. If i add here new question then i title is disappearing hits. I can add default value in input, but this isnt this. Here is another. How can i make this? And how can i make this in input password? There is *, so how can i write in clean text? Generally what this is name?

Thanks for help!

<form>
First name: <input type="text" name="firstname" value="First Name" /><br />
Last name: <input type="text" name="lastname" value="Last Name" /> <br />
Password: <input type="password" name="pwd" value="password" />
</form>

score 0 · Answer 1 · answered Aug 06 '11 at 08:31

0

Use placeholder attribue ;)

<input type="text" placeholder="default text" />
<input type="password" placeholder="default text" />

answered Aug 06 '11 at 08:31

ChristopheCVB

7,269
1
29
54

score 0 · Accepted Answer · edited May 23 '17 at 12:19

I think this is what you're looking for:

<input type="password" name="pwd" value="password" placeholder="Enter password" />

However it will only work in some browsers. So if you want to support the majority, you'll need some js to pre-fill it. Google 'html input hint' or 'placeholder'. There are js plugins for this out there.

Here's a related stackoverflow thread: How do I make an HTML text box show a hint when empty?

score 0 · Answer 3 · answered Aug 06 '11 at 08:44

I recommend a combination of the placeholder attribute and feature detection so you know whether the browser supports it, and falling back on JavaScript code if it doesn't.

So your markup would be:

First name: <input type="text" name="firstname" placeholder="First Name" />

...and it'll get handled by browsers that support it, ignored by ones that don't.

The feature detection is easy:

var text = document.getElementById("yourfieldid");
if ("placeholder" in text) {
    // The browser supports placeholders, your markup should be sufficient
}
else {
    // Browser doesn't, need to do something with JavaScript
}

I've written a jQuery plug-in that does this.

disappearing form hits?

3 Answers3