web-dev-qa-db-fra.com

evénement jQuery lors du changement de valeur d'entrée masqué

J'ai cette entrée cachée:

<input id="j_idt26:myValue" type="hidden" name="j_idt26:myValue" value="0?100?">

Je veux alerter "hé" la première fois que la valeur est définie, puis à chaque fois qu'elle change.

J'ai quelque chose comme ça:

$(document).ready(function(){
    var $hello= $('[id$=myValue]');

    $hello.bind("change load", function(){
        alert('hey');
    });
});

Mais rien ne se présente.
Si vous pouvez aider
Merci

jqueryeventsevent-handling
12
Loric-
$(function(){
    var $hello= $('[id$="myValue"]');

    $hello.on("change", function(){ //bind() for older jquery version
        alert('hey');
    }).triggerHandler('change'); //could be change() or trigger('change')
});

Ensuite, chaque fois que vous modifiez la valeur des entrées masquées ciblées, déclenchez le gestionnaire, par exemple:

$('#j_idt26:myValue').val('0?200?').triggerHandler('change');

En effet, l'événement onchange n'est pas déclenché, ce qui change automatiquement sa valeur par programme.

18
A. Wolff

L'événement change est déclenché après l'événement blur sur une entrée, c'est-à-dire lorsque l'entrée perd le focus. La documentation MDN décrit ceci:

Lorsque l'élément perd le focus après que sa valeur a été modifiée, mais pas validé (par exemple après avoir modifié la valeur de ou).

Puisque la variable input est de type masquée, il n'y aura jamais d'interaction entre l'utilisateur et la variable input, ce qui signifie qu'elle ne changera pas à moins que le script côté client fourni par votre site ne la modifie, ce qui ne déclenchera pas l'événement change.

Voici deux options:

Appel change () explicitement

Chaque fois que vous modifiez la valeur de l'appel d'entrée masqué .change() pour déclencher l'événement.

$(document).ready(function(){
    var $hello= $('[id$=myValue]');

    $hello.on("change", function(){
        alert('hey');
    });

    $hello.val("Something");
    $hello.change();
});

Il suffit d'appeler le code sans le gestionnaire

Au lieu d'utiliser le gestionnaire d'événements, exécutez simplement le code que vous auriez dans la source.

$(document).ready(function(){
    var $hello= $('[id$=myValue]');
    $hello.val("Something");
    alert('hey');
});

Une autre chose que je voudrais mentionner est que le sélecteur peut être un peu mieux défini.

    var $hello= $('input[id$=myValue]');

Et si vous utilisez une nouvelle version de jQuery, préférez on au lieu de bind, comme indiqué dans l'exemple ci-dessus.

3
Kevin Bowersox

C'est très facile : 

$('#my_id').val(myValue).trigger('change');

Ensuite, vous pouvez détecter la valeur de changement sur $ ('# my_id')

1
Rémi P

Vous pouvez essayer ce code:

$(function(){
    var $hello = $('[id$="myValue"]');

    $hello.bind("change load", function(){
        alert('hey');
    });
});
0
Lucas Willems