web-dev-qa-db-fra.com

Obtenir la valeur par défaut d'une entrée à l'aide de jQuery

$(".box_yazi2").each(function () {
    var default_value = this.value;
    $(this).css('color', '#555'); // this could be in the style sheet instead
    $(this).focus(function () {
        if (this.value == default_value) {
            this.value = '';
            $(this).css('color', '#000');
        }
    });
    $(this).blur(function () {
        if (this.value == '') {
            $(this).css('color', '#555');
            this.value = default_value;
        }
    });
});

Cette fonction de valeur par défaut d'entrée ne fonctionne pas dans FF, mais fonctionne parfaitement dans IE Bien entendu, l'entrée elle-même ressemble à ceci:

<input type="text" class="box_yazi2" id="konu" name="konu" value="Boş" />
javascriptjqueryhtmlinputdefault-value
17
Bato Dor

La solution est assez simple. vous avez un }); supplémentaire dans votre code (merci @ Box9).

Je vous encourage à réutiliser la variable et à ne pas créer des dizaines d'objets jQuery.

J'ai changé votre exemple en background-color mais cela fonctionnera.

$('.box_yazi2').each(function(index, element) {
    var $element = $(element);
    var defaultValue = $element.val();
    $element.css('background-color', '#555555');
    $element.focus(function() {
        var actualValue = $element.val();
        if (actualValue == defaultValue) {
            $element.val('');
            $element.css('background-color', '#3399FF');
        }
    });
    $element.blur(function() {
        var actualValue = $element.val();
        if (!actualValue) {
            $element.val(defaultValue);
            $element.css('background-color', '#555555');
        }
    });
});

démo

9
Andreas Niedermair

Utilisez simplement la propriété defaultValue :

var default_value = $(this).prop("defaultValue");

Ou:

var default_value = this.defaultValue;
71
Salman A
$('input[type="text"]').focus( function(){
            elementValue = $(this).val();
            $(this).val("");
        });
        $('input[type="text"]').blur( function(){
            if($(this).val() != elementValue && $(this).val() != ""){

            }else{
                $(this).val(elementValue);
            }

        });
2
lior amrosi

Utilisez this.defaultValue

Désolé pour le lien vers w3notcools, http://www.w3schools.com/jsref/prop_text_defaultvalue.asp

1
23inhouse

J'utilise le code suivant:

    //clear the focused inputs
$('input[type="text"]').focus( function(){
    if( $(this).attr('value') == $(this).attr('defaultValue') ){
        $(this).attr('value', '');
    };
} );
$('input[type="text"]').blur( function(){
    if( $(this).attr('value') == '' ){
        $(this).attr('value', $(this).attr('defaultValue') );
    };
} );
1
Sirozha

Pour être honnête, vous devriez utiliser prop au lieu de tant de fonctions. Utilisez 'delegate' au lieu de 'on' pour la liaison statique tardive.

$('.box_yazi2').each(function() {

$(this).on('focus', function(){

   if($(this).val() == $(this).prop('defaultValue')){

      $(this).val('');
      $(this).css('color', '#000');
    }

});

$(this).on('blur', function(){

   if($(this).val() == ''){

      $(this).val($(this).prop('defaultValue'));
      $(this).css('color', '#000');
   }

});

});
0
Wahab Qureshi