Home/ Questions/Q 8048917
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-05T06:37:59+00:00

I have some code like the following: <html> <body> <div id=product_descriptioncontent> <input type=text id=a

  • 0

I have some code like the following:

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

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?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    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());
});​​

    JSFiddle

    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().

    • 0