jQuery event listener for when text has changed in a <td> cell?

Question

Is there any way in jQuery to attach a listener to a <td> cell so that when the text inside the cell has changed (by JavaScript, not the user), the event is triggered?

Answer 1

To extend mway's answer, here is some code.

var td = $('#my-table tr td:eq(1)');
var tdHtml = td.html();
setInterval(function() {

    if (td.html() !== tdHtml) {
         // it has changed
         tdHtml = td.html();
    } 

}, 500);

... and for his second suggestion.

function updateTd(html) {
     $('#my-table tr td:eq(1)').html(html);

     // additional code
}

You could also bind the DOMSubtreeModified event to the element, but browser support isn't the best.

Answer 2

Not natively, no. You have a couple options:

1) Use setInterval() to test the value against its previous value, and act accordingly if it is different.

2) Use a common method for changing the cell contents, such that you can also perform additional logic when its value is changed without rewriting it numerous times.