Paste the default value if input text is deleted

Question

I have the following jQuery code:

$(".SearchForm input:text").each(function(){        
    /* Sets the current value as the defaultvalue attribute */
    if(allowedDefaults.indexOf($(this).val()) > 0 || $(this).val() == "")
    {
        $(this).attr("defaultvalue", $(this).val());
        $(this).css("color","#9d9d9d");


        /* Onfocus, if default value clear the field */
        $(this).focus(function(){               
            if($(this).val() == $(this).attr("defaultvalue"))
            {
                $(this).val("");
                $(this).css("color","#4c4c4c");
            }
        });

        /* Onblur, if empty, insert defaultvalue */
        $(this).blur(function(){
            alert("ud");

            if($(this).val() == "")
            {   
                $(this).val($(this).attr("defaultvalue"));                  
                $(this).css("color","#9d9d9d");
            }else
            {
                $(this).removeClass("ignore");

            }   
        }); 

    }

});

I use this code to insert some default text into some of the input fields when nothing is typed. This means that when the user sees my search form, the default values ​​will be set as an attribute at the input level, field, and this will be the displayed value. When the user clicks inside the input field, the default value will be deleted.

When the user sees the input field first, he looks like this:

<input type="text" value="" defaultvalue="From" />

, . - , , . , -, . , , , ?

, , ​​:

<input type="text" value="someValue" defaultvalue="From" />

.

, ? , , .

,

Answer 1

defaultvalue 3-5 . 2 , .

/* Sets the current value as the defaultvalue attribute */
if(allowedDefaults.indexOf($(this).val()) > 0 || $(this).val() == "")
{
    $(this).attr("defaultvalue", $(this).val());

, , (""). , , . , , if. , . - focus css.

// in your css
.SearchForm input { color: #9d9d9d; }
.SearchForm input.focused,
.SearchForm input:focus { #4c4c4c; }


$(".SearchForm input:text")
    //.unbind('focus').unbind('blur') // uncomment if playing in the console
    .focus(function () {
        var $this = $(this);
        if ($this.val() == $this.attr("defaultvalue")) 
        {
            $this.val("")
                 //.addClass('focused');
        }
    })
    .blur(function () {
        var $this = $(this);
        if ($this.val().trim() == "") 
        {
            $this.val($this.attr("defaultvalue"));
        }
        //$this.removeClass('focused');
    });

:: IE < 8, , IE6 , . , IE6 css .

Answer 2

, - , . script , , , , . .

$('#nav-search-box').addClass("idleField").focus(function() {
$(this).removeClass("idleField").addClass("focusField");
if (this.value == this.defaultValue) {
this.value = '';
}
if (this.value != this.defaultValue) {
this.select();
}
}).blur(function() {
$(this).removeClass("focusField").addClass("idleField");
if ($.trim(this.value) == '') {
this.value = (this.defaultValue ? this.defaultValue : '');
}
}).keypress(function(e) {
if (e.which == 13) {
window.location = "/search/" + $(this).val();
}
}); 

, - .

function disableFormPost()
{
    $("#formid").submit(function() { return false });
}