Obtenir la valeur par défaut de l'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 la valeur par défaut de l'entrée ne fonctionne pas dans FF, mais fonctionne parfaitement sous IE
et bien sûr l'entrée elle-même ressemble à ceci:

<input type="text" class="box_yazi2" id="konu" name="konu" value="Boş" />

Pourquoi n'utilisez-vous pas this.defaultValue?
La dernière ligne est un ensemble supplémentaire de });. Est-ce juste mal copier-collé?
je ne sais pas, il va les aider?
Eh bien, il fonctionne dans le Fx ici.
ne Firebug retourner une erreur d'un genre peut-être? Aussi, si vous voulez juste pour obtenir ce fait (et ne le font pas pour objectif d'apprentissage): mucur.nom/système/jquery_example
ouais ) c'est la dernière fonction dans le document.ready )) @jensgram je vais essayer merci

InformationsquelleAutor Bato Dor | 2011-01-04

La solution est très simple; vous avez un supplément de }); dans votre code (merci @ Box9).

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

J'ai changé par votre exemple, à background-color mais il faudra travailler.

$('.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

InformationsquelleAutor Andreas Niedermair

74

Suffit d'utiliser la valeur par défaut propriété:
```
var default_value = $(this).prop("defaultValue");
```
Ou:
```
var default_value = this.defaultValue;
```
- vous devez élaborer votre exemple. actuellement, il n'y a pas d'attribut defaultValue
- valeur par défaut est intégré dans l'attribut accessible via JavaScript. Pour input[type=text], il contient la valeur d'origine de l'élément d'entrée... la valeur qui était présent lorsque la page a été chargée.
- NICE! Je n'avais aucune idée. Est cet attribut largement pris en charge/accessible de cette manière?
- Voir Interface HTMLInputElement comme décrit dans DOM niveau 2 les spécifications et HTMLInputElement sur MDN. D'autres attributs intéressants sont defaultChecked et defaultSelected pour la radio, cases à cocher et les options à l'intérieur de sélectionner l'élément.
- .attr('valeur par défaut') ne fonctionne pas dans jQuery, comme attr appelle les Attributs HTML.
- il l'habitude de travailler quand j'ai posté cette réponse. J'ai révisé la réponse pour la version actuelle de jQuery.
- Il y a une diff entre les attributs et les propriétés en HTML. pour obtenir la valeur par défaut ou defaultChecked, nous devrions utiliser la .prop() la méthode. Il y a une bonne explication à jQuery.com: api.jquery.com/prop
InformationsquelleAutor 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);
            }

        });

InformationsquelleAutor lior amrosi

Je suis en utilisant 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') );
    };
} );

Vous ne devriez pas utiliser .attr('value', ...) mais .val(...) pour modifier un élément de la valeur!

InformationsquelleAutor Sirozha

1

Utilisation this.defaultValue

Désolé pour le lien vers w3notcools, http://www.w3schools.com/jsref/prop_text_defaultvalue.asp
- w3schools est un horrible de ressources. Une meilleure référence serait developer.mozilla.org/en-US/docs/DOM/...
- ThiefMaster, j'ai beaucoup appris grâce à w3schools et je ne peux pas partager votre point de vue de l'être "horrible ressource". Juste parce qu'il y a de mieux et de plus en plus détaillées ou plus avancées ressources que le site web mentionné, il ne rend pas la 'horrible'. Aussi, le fait qu'ils n'ont pas n'importe quoi avec le W3C ou que quelqu'un a créé un site web à bash - ne veut pas dire quelque chose au sujet de leur "horribleness'. Pour dire la vérité - W3C-mêmes ont tellement horrible solutions/décisions qu'ils sont les derniers à bash d'autres personnes ou sociétés.
- href="http://meta.stackexchange.com/questions/87678/discouraging-w3schools-as-a-resource" title="décourager w3schools comme une ressource">meta.stackexchange.com/questions/87678/...
InformationsquelleAutor 23inhouse

Vous devez utiliser prop au lieu de tant de nombreuses fonctions pour être honnête, l'utilisation de "délégué" au lieu de " on " pour les late static binding.

$('.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');
   }

});

});

InformationsquelleAutor Wahab Qureshi

Vous devez vous connecter pour publier un commentaire.