comment déclencher un événement sur un changement de texte d’étiquette

Consultez la documentation de l’événement de change . Il ne se déclenche que pour certains types d’éléments:

L’événement change est déclenché pour les éléments , et lorsqu’une modification de la valeur de l’élément est validée par l’utilisateur …

Vous ne pourrez pas utiliser l’événement change pour un élément qui ne fait pas partie des types mentionnés précédemment.

Si vous avez un autre moyen de savoir que l’édition d’un élément spécifique est terminée, vous devez déclencher votre propre événement, éventuellement en utilisant l’ événement blur sur l’élément ayant servi à modifier la valeur. L’événement de blur est déclenché lorsque l’élément sélectionné perd le focus, par exemple lorsqu’un utilisateur clique (ou tabule) hors d’un élément d’entrée.

Pour que label .change() ne fonctionne pas, vous pouvez donc essayer quelque chose comme ceci en utilisant sortinggger() qui appelle notre événement personnalisé, ici fnLabelChanged est mon événement personnalisé

.change() événement .change() a fonctionné pour , , .ie

 $("button").on('click',function(){ $("#frameGroupCode").text("Hello").sortinggger("fnLabelChanged"); }); $("#frameGroupCode").on('fnLabelChanged', function(){ console.log('changed'); }) 

Démo de travail

Vous pouvez obtenir le texte actuel de l’étiquette et vérifier si la valeur est différente au démarrage ou lors de l’appui sur un bouton. L’événement change ne fonctionne pas pour les éléments non formels.

Si vous utilisez $("#frameItemCode").text('abc') pour changer le libellé (comme vous l’avez commenté), appelez simplement l’ alert("changed") après cela. Pas besoin de définir un auditeur d’événement.

 $("#frameItemCode").text('abc'); alert("changed"); 

Si l’étiquette change de plusieurs manières, définissez un timeInterval pour vérifier si l’étiquette a changé,

 function inspectLabel(callback){ var label = $("#frameItemCode").text(); setInterval(function(){ var newlabel = $("#frameItemCode").text(); if (newlabel != label){ callback(); label = newlabel; } }, 100); } inspectLabel(function(){ alert('changed'); }); 

Je ne pense pas que l’étiquette ait un événement change () associé. Si vous voulez y arriver, vous pouvez le faire via JQuery ou JS. Parce que changer le texte de l’étiquette dynamicment se fait par Jquery ou JS.

Au lieu de cela, vous pouvez créer une fonction et l’appeler lorsque l’étiquette est en cours de modification, à partir du moment où la modification du texte lable a lieu.

Selon les navigateurs à prendre en charge, vous pouvez utiliser MutationObserver :

 var observer = new MutationObserver( function (mutations) { alert('Label was changed!'); } ); observer.observe(document.querySelector('#frameGroupCode'), { childList: true }); 

Exemple jsFiddle