Question

I am trying to come up with a simple jquery input watermark function. Basically, if the input field has no value, display it’s title.

I have come up with the jquery necessary to assign the input’s value as it’s title, but it does not display on the page as if it was a value that was hand-coded into the form.

How can I get this to display the value when the page loads in the input field for the user to see?

Here’s the fiddle: http://jsfiddle.net/mQ3sX/2/

$(document).ready(function() {

    $(".wmk").each(function(){
      var value = $(this).val();
      var title = $(this).attr("title");

      if (value == '') {
        value = title;
      }

      $(".result").text(value);
      // You can see I can get something else to display the value, but it does 
      // not display in the actual input field.            
    });

});

Answer 1

Use the below line of code. You need to specify the input element, and update its value. Since your input field has a class called ‘.wmk’, I am using the below code. You can use “id” and use “#” instead of “.”. Read more about selectors at http://api.jquery.com/category/selectors/

$(".wmk").val(value);

Updated jsfiddle http://jsfiddle.net/bhatlx/mQ3sX/9/

Update: since you are using ‘each’ on ‘.wmk’, you can use

 $(this).val(value)