javascript - Onclick event issue after using the outerHTML -
this html code :
<div > <div class="incasari"> <div class="data_incasare_container"> <label><b>data</b></label> <input class ="data_incasare" type="text" id="datepicker"> <label class ="data_incasare_hidden">12-06-2014</label> </div> <div class="suma_incasare_container" style=""> <label><b>suma</b></label> <input class="suma_incasare" type="text" maxlength="8" name="pret_unitar[]" alt=""> <label class ="suma_incasare_hidden">100</label> </div> <div class="coscos" style=""> <a class="stergereincasare" href="javascript:void(0);"><i class="icon-trash"></i></a> <div style="clear:both;"></div> <div class ="incasare_action"> <input class="btn btn-success" type="button" style="margin-left:50px;width:80px;height:30px;float:left;" value="salveaza"></input> <a href="javascript:void(0);" class="del_incasare delrow"></a> </div> <div style="clear:both;"></div> </div> <div style="clear:both;"></div> </div> <div style="clear:both;"></div> <a href="#" class="adauga_incasare">+ adauga incasare noua</a> <div class="toram"> <label style = 'cursor:default;'>total incasat: <b>100 €</b></label> <label style = 'cursor:default;'>total ramas: <b>1012 €</b></label> </div> </div>
and javascript code:
$(".adauga_incasare").click(function(){ var html = $(".incasari")[0].outerhtml; $(html).insertafter($(".incasari").last()); }); $(".del_incasare").click(function(){ alert("dsdasdasd"); });
the outerhtml works fine, when "clone" class incasari after , when onclick event doesnt work on clone part. have delete button. in first class "incasari" in works , in clone class not . why ?
use event delegation because element dynamically created after click event assigned. example, delegate document:
$(document).on("click", ".del_incasare", function(){ alert("dsdasdasd"); });
this means clicks checked .del_incasare
selector, , if matches function run, regardless of when element created.
Comments
Post a Comment