jQuery .on触发事件侦听器

Question

There is a best practice to invoke a jQuery change handler immediately afters its definition to re-use the code and initialise the GUI, like

$("#mySelect").change(function() {
  $("#myTextField").val( $(this).text());
}).change(); // here the element is immediately triggered, so one does not need a separate code path for the init-case

Without the immediate call using .change() the GUI would not reflect the initial value of #mySelect in #myTextfield.

With newer versions of jQuery I would like to use event-delegation and do the same stuff using the .on() API.

$("#myForm").on('change', '#mySelect', function() {
  $("#myTextField").val( $(this).text());
}).change();

This does not work anymore, because the .change() is not triggered on the right element and not with the right event.target, so jQuery can't call my event handler.

This works, but does no longer reflect the best practice without the separate init code-path:

$("#myForm").on('change', '#mySelect', function() {
  $("#myTextField").val( $(this).text());
});
$("#mySelect").change();

Question: Any good way to solve this, without re-selecting the element and triggering the event?

Answer 1

You would need to find all the elements and call trigger on them... Because delegation delegates the handling to some other element up the DOM (as you likely know)

You would essentially have to do what you have done in your 3rd example. I know of no other way to achieve this.