Thursday, April 25, 2024
 Popular · Latest · Hot · Upcoming
rated 0 times [  30] [ 6]  / answers: 1 / hits: 15475  / 12 Years ago, wed, june 6, 2012, 12:00:00

I have some code like the following:

<div id=product_descriptioncontent>
<input type=text id=a />
<textarea id=b />

That means, my div contains either inputs, text areas or images. But my question is how to detect the changes when any children value changed in a div?

More From » jquery


The onchange event only fires when the element loses focus, that is, when it blurs with a different value than when it gained focus.

I'm not aware of any native listener that would provide such functionality in real time, but you could try maneuvering jQuery's .data() method to store the current value and check against it in a standard keyboard event, such as keyup:

$('#product_descriptioncontent').children().each(function() {
$(this).on('keyup', function() {
if ($(this).data('c_val') != $(this).val()) {
alert('value changed!');
//do other stuff
$(this).data('c_val', $(this).val());
}).data('c_val', $(this).val());


Note that you may also remap the keyup to multiple events for extra checks:

$(this).on('keyup mouseup blur', function(){

As well as simply calling $('#element').keyup() will trigger the on function for that element, if you ever need to call it without the user inputting anything. =]

Note that the .on() jQuery method is only supported in jQuery 1.7+, for older versions you should use .live().

[#85119] Tuesday, June 5, 2012, 12 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.

Total Points: 249
Total Questions: 115
Total Answers: 119

Location: Liechtenstein
Member since Sun, Sep 12, 2021
3 Years ago