jQuery- rilevare il cambiamento nel contenuto di un campo SPAN

Question

ho il pezzo di sotto del codice che viene utilizzato per simulare una casella di testo:

<label for="alertCmpVal">ALERT VALUE:</label> 
<span class="center textBox displayField highlight" id="alertCmpVal" contenteditable> <?php print $alert_val;?> </span> 

Ho bisogno di sapere quando cambia il contenuto, ad esempio, Clicco su di esso, e cambiare da 0 a 1.

ho provato:

$(document).ready(function() 
{ 
    $(document.body).on('change','#alertCmpVal',function() 
    { 
     alert("boo"); 
     $('#alertCmpVal').removeClass('highlight'); 
    }) 
} 

ma questo non sembra funzionare.

(nb $(document.body) viene utilizzato perché sulla mia pagina principale, il campo iniziale viene caricata dinamicamente)

Sto indovinando è il 'cambiamento' che non piace, ma non riesco a vedere che cosa per sostituirlo con. (jQuery/HTML5 va bene, poiché è usato solo internamente).

Ho visto alcuni esempi, ma in genere sembrano essere per scenari più complessi, richiedono più funzioni per rilevare il cambiamento quando si verificano certe altre cose, ma immagino ci deve essere una soluzione più semplice simile al metodo on change .

Answer 1

È possibile utilizzare questo evento DOMSubtreeModified:

$("span").on('DOMSubtreeModified', function() { 
    alert("Span HTML is now " + $(this).html()); 
}); 

Snippet

$(function() { 
 
    $("a").click(function() { 
 
    $("span").html("Hello, World!"); 
 
    }); 
 
    $("body").on('DOMSubtreeModified', "span", function() { 
 
    alert("Span HTML is now " + $(this).html()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<span>Hello</span> 
 
<a href="#">Click</a>

Answer 2

penso che questo codice vi aiuterà.

$(document).ready(function() { 
    $('#myId').bind("contentchange", function(){ 
     alert("Changed"); 
    }); 

    $("#btn").click(function() { 
     $('#myId').html("Value").trigger("contentchange"); 
    }); 
}); 

http://jsfiddle.net/RKLmA/192/