Home/ Questions/Q 6735679
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T11:02:27+00:00

Hey guys i was just wondering how to do this in a input type

  • 0

Hey guys i was just wondering how to do this in a input type of text
when the user has not click the box. show “Edit Name” in the box with a slightly grey font color.
When the user clicks in the box it changes to “John Doe” and then they can edit it then submit

//EDIT
doesn’t work as it already has a value set. i need the placeholder to show until clicked then the value shows

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If you’re using HTML5 the Placeholder attribute is the way to go.

    If not just grab one of the many watermark scripts out there for jQuery or Javascript (e.g. jQuery Watermark.

    EDIT

    One manual way to do what you want with jQuery and CSS:

    // CSS 
#name{color:#ccc;}

// HTML
<input type="text" name="name" id="name" size="30" value="Edit Name" />

// jQuery
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $('#name').bind('focus', function() {
    if ($(this).val() == 'Edit Name') {
      $(this).val('John Doe').css('color', '#000');
    }
  });
});
</script>

    Put the jQuery section in the code above into the <head> section of your HTML document and you should be good to go.

    • 0