.change()

Syntax and Description


.change(handler)             
.change()

handler is a function to execute each time the event is triggered. Return value is the jQuery object, for chaining purposes.

jQuery change event binds an event handler to the change JavaScript event, or trigger that event on an element.

.change(handler) is a shortcut for .bind('change', handler). .change() is a shortcut for .trigger('change').


$('#other').click(function() {
   $('.target').change();
});

form select change handler

The following code attaches a change event to the select element. If the option is selected it will show the selected option in the div element.


<html>
  <head>
    <script src="http://java2s.com/style/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){<!--   ww w.  java2  s.  com-->
            $("select").change(function () {
                  var str = "";
                  $("select option:selected").each(function () {
                        str += $(this).text() + " ";
                      });
                  $("div").text(str);
                })
                .change();
        });
    </script>
  </head>
  <body>
    <body>
        <select name="sweets" multiple="multiple">
            <option>A</option>
            <option selected="selected">B</option>
            <option>C</option>
            <option selected="selected">D</option>
            <option>E</option>
            <option>F</option>
          </select>
          <div></div>
    </body>
</html>

Click to view the demo

The code above generates the following result.