jQuery method to set and remove the default value of the text box

  • 2020-05-12 02:09:50
  • OfStack

This example shows you how to set and remove the default values for text boxes on jQuery. Share with you for your reference. The specific analysis is as follows:

To start, the text box is set to 1 default value. When the cursor moves to the textbox, clear the textbox if the current value is the default value. If the textbox value is empty when leaving the textbox, set the textbox value to the default value.

The code is as follows:


$(document).ready(function() {
  //each Traverse the text box 
  $(".input").each(function() {
    // Saves the value of the current text box 
    var vdefault = this.value;
    $(this).focus(function() {
      // When you get focus, if the value is the default, it is set to null 
      if (this.value == vdefault) {
        this.value = "";
      }
    });
    $(this).blur(function() {
      // When you lose focus, if the value is empty, it is set to the default value 
      if (this.value == "") {
        this.value = vdefault;
      }
    });
  });
});

I hope this article has been helpful to your jQuery programming.


Related articles: