javascript - Override return value in event handler? -


i'm sure has been asked before, haven't had luck finding answer. there's term don't know.

can jquery event handler return element other 1 triggered?

normally, when trigger jquery event element, element returned event handler. there way return different element instead? (other event.target, event.currenttarget, etc.)

here's html:

<div id="content">     <div id="wrapper">         <div class="instance">         </div>     </div> </div> 

if make custom jquery event #wrapper, can make event handler return .instance?

here's javascript:

$('#content').on('new.instance', '#wrapper', function(event) {     var wrapper = $(event.currenttarget);     var instance = wrapper.find('div.instance').first();      var newinstance = instance.clone(true, true);     newinstance.appendto(wrapper);      return newinstance; });  var returnvalue = $('#wrapper').trigger('new.instance'); console.log('returnvalue.html():', returnvalue.html()); // #wrapper, not .instance 

can make new.instance event handler return .instance element? if so, missing in code?

.trigger()

... when define custom event type using .on() method, second argument .trigger() can become useful.

you add object .trigger method second parameter , collect instances in there.

var instances = {data:[]};    $('#content').on('new.instance', '#wrapper', function(event, instances) {    var wrapper = $(event.currenttarget);    var instance = wrapper.find('div.instance').first();    var newinstance = instance.clone(true, true);    instances.data.push(newinstance);    newinstance.appendto(wrapper);  });    $('#wrapper').trigger('new.instance', instances);    console.log(instances.data[0].get(0));    // somewhere else @ latter time trigger new.instance again  settimeout(function() {    $('#wrapper').trigger('new.instance', instances);    $.each(instances.data, function(index, item) {      var counter = index + 1      item.text( 'cloned instance ' + counter );      console.log(item.get(0))    })  }, 2000)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div id="content">    <div id="wrapper">      <div class="instance"></div>    </div>  </div>


Comments