jquery绑定事件，插入的表格行将不会响应事件

我正在将一个表格行插入到表格中，无论如何它会变得混乱。我有一个函数会在3个文本字段中的一个发生变化时被调用，这很好，我使用“inputfield”类来附加事件。但是，当我插入行时，即使它具有相同的类标记，也不会发生相同的行为。jquery绑定事件，插入的表格行将不会响应事件

所以我试图将事件绑定到它，这不工作任何想法为什么？

//code for inserted row 
var $html='<tr class="newrow" id="newrow'+$totrecords+'"><td><div id="discountlist_'+$totrecords+'">'+$totrecords+'</div></td><td><label for="ProductProductCode'+$totrecords+'"></label><input name="data[Product][product_code'+$totrecords+']" type="text" id="ProductProductCode'+$totrecords+'"/></td><td><label for="ProductHeight'+$totrecords+'"></label><input name="data[Product][height'+$totrecords+']" type="text" value="0" id="ProductHeight'+$totrecords+'"/></td><td><label for="ProductWidth'+$totrecords+'"></label><input name="data[Product][width'+$totrecords+']" type="text" value="0" id="ProductWidth'+$totrecords+'"/></td><td><label for="ProductPrice'+$totrecords+'"></label><input name="data[Product][price'+$totrecords+']" type="text" id="ProductPrice'+$totrecords+'" class="fieldinput" /></td><td><label for="ProductDiscountPercent'+$totrecords+'"></label><input name="data[Product][discount_percent'+$totrecords+']" type="text" id="ProductDiscountPercent'+$totrecords+'" class="fieldinput"/></td><td><label for="ProductDiscountListprice'+$totrecords+'"></label><input name="data[Product][discount_listprice'+$totrecords+']" type="text" id="ProductDiscountListprice'+$totrecords+'" /></td><td><label for="ProductQuantity'+$totrecords+'"></label><input name="data[Product][quantity'+$totrecords+']" type="text" id="ProductQuantity'+$totrecords+'" class="fieldinput"/></td><td><div class="total" id="total_'+$totrecords+'"></div</td>'; 


    //method 1 insert the row 
    $(this).closest('TR').after($html); 

    //bind event to productprice table 
    $("#ProductPrice"+$totrecords).bind("change",calculateTotal); 


function I'm trying to call 

//custom function 
var calculateTotal = function(){ 

    alert('ok'); 

    var $discountpercent = null; 
    var $total=null; 
    var $quantity=null; 
    var $id=null; 

    //get id of textbox 
    var $id=$(this).attr('id'); 

    //get the row id 
    //need to fix this and get all chars to the right of the 
    $id=$id.toString(); 
    var myArray = $id.split('_'); 
    $id=myArray[1]; 


    var $listprice= $("#listprice_"+$id).val(); 

    //turn entered number into % 
    $discountpercent= $("#discountpercent_"+$id).val()/100; 

    $discountlistprice=$listprice-($listprice*$discountpercent);  
    $quantity=$("#quantity_"+$id).val(); 

    //calculate total 
    $total=$quantity*$discountlistprice; 

    //set the value 
    $("#discountlistprice_"+$id).val($discountlistprice); 

    //set the total by changing the total div 
    $("#total_"+$id).html($total); 
}

来源

2012-03-16 fuzzy dunlop

请创建一个小提琴用尽可能少的代码尽可能地帮助你的问题更清楚。 – iambriansreed 2012-03-16 19:54:25

事件需要被反弹才能在新的DOM元素上起作用。您可以使用.live()（来自jQuery v1.7，使用.on()）函数将其应用于所有将来的元素，或者您可以在插入后简单地重新绑定它。

.live（）（预1.7）：

//bind event to productprice table 
    $("#ProductPrice"+$totrecords).live("change",calculateTotal);

。对（）（1.7及更高版本）：

$("#ProductPrice"+$totrecords).on("change",calculateTotal);

来源

2012-03-16 20:03:44 Damien

即时通讯试图做到这一点; //将事件绑定到产品价格表 '$（“＃ProductPrice”+ $ totrecords）.bind（“change”，calculateTotal）;' doestn为我工作 – 2012-03-16 20:05:40

感谢您的工作:) – 2012-03-16 20:09:09

酷:)出于兴趣，你使用.on（）或live（）？你使用的是哪个版本的jQuery？（只是好奇）。 – Damien 2012-03-16 20:09:59

jquery绑定事件，插入的表格行将不会响应事件

回答

相关问题