jQuery Auslöser Klick nach insert

Question

Ich versuche, herauszufinden, wie Click-Ereignis direkt nach insertBefore

$this = $(this); 
var changeImageHTML = '<div class="sample1 sample2">&nbsp;</div>'; 

//attempt 1 
$(changeImageHTML).insertBefore($this).trigger('click'); 

//attempt 2 
$(changeImageHTML).insertBefore($this).find('.sample2').trigger('click'); 

//attempt 3 
$(changeImageHTML).insertBefore($this).find('.sample1.sample2').trigger('click'); 

//attempt 4 
$(changeImageHTML).insertBefore($this).bind('click').trigger('click'); 

.sample2 auslösen -> eine Klasse eines bestimmten Plugin auslösen Ich versuche.

Version: jQuery 2.1

Vielen Dank für Ihre Hilfe. :)

Answer 1

Probieren Sie es aus, Sie müssen einen Click-Handler zum Zielelement geben, in Ihrem Fall wird click-Ereignis aufgerufen, aber Handler fehlt, so dass das Ereignis verloren geht.

$(document).ready(function(){ 
 
$this = $("div.container"); 
 
    var changeImageHTML = "<div class='sample1 sample2' onclick='test()'>test</div>"; 
 
    $(changeImageHTML).insertBefore($this).click() 
 
}) 
 
function test(){ 
 
    alert("ok") 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container">Container</div>

Answer 2

Verwenden event delegation

$(document).on("click", ".sample1.sample2", function() { 
 
    alert("clicked") 
 
}) 
 

 
var changeImageHTML = '<div class="sample1 sample2">&nbsp;sample</div>'; 
 
var $this = $("div"); 
 

 
$(changeImageHTML).insertBefore($this).trigger('click');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div>div</div>