關於帶文本框的html行的克隆新文本框的觸發器

Question

我想創建一個重複行，點擊重複行是該html表的最後一行，但問題是，在newle創建的行上的文本框是不是觸發器作爲類是一樣的是原來的，但在按鍵的數字功能，增加了逗號和檢查字母沒有發生

Demo JS Fiddle

HTML：

<table id='tbl'> 
    <tbody> 
     <tr> 
      <td> 
       <p>cell</p> 
      </td> 
      <td> 
       <input name="txtMSExMarCardFee2" type="text" class="Stylednumber"> 
      </td> 
     </tr> 

    </tbody> 
</table> 

<input type="button" id="btnAdd" value="Add New Row"></button> 

JS

$("#btnAdd").on("click",function(){ 

var $tableBody = $('#tbl').find("tbody"), 
     $trLast = $tableBody.find("tr:last"), 
     $trNew = $trLast.clone(); 

    $trLast.after($trNew); 
}); 

    String.prototype.replaceAll = function(search, replacement) { 
    var target = this; 
    return target.replace(new RegExp(search, 'g'), replacement); 
}; 



$('input.Stylednumber').keyup(function() { 
    var input = $(this).val().replaceAll(',', ''); 
    if (input.length < 1) 
    $(this).val('0.00'); 
    else { 
    var val = parseFloat(input); 
    var formatted = inrFormat(input); 
    if (formatted.indexOf('.') > 0) { 
     var split = formatted.split('.'); 
     formatted = split[0] + '.' + split[1].substring(0, 2); 
    } 
    $(this).val(formatted); 
    } 
}); 

function inrFormat(val) { 
    var x = val; 
    x = x.toString(); 
    var afterPoint = ''; 
    if (x.indexOf('.') > 0) 
    afterPoint = x.substring(x.indexOf('.'), x.length); 
    x = Math.floor(x); 
    x = x.toString(); 
    var lastThree = x.substring(x.length - 3); 
    var otherNumbers = x.substring(0, x.length - 3); 
    if (otherNumbers != '') 
    lastThree = ',' + lastThree; 
    var res = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree + afterPoint; 
    return res; 
} 

Answer 1

$('input.Stylednumber').keyup函數將事件綁定到當前在dom中的元素。如果要將事件綁定到動態創建的元素，則必須指定全局作用域，如body，或者在這種情況下，它可以是table#tbl。

$('table#tbl').on('keyup', 'input.Stylednumber', function(){ ... }); 

這裏的小提琴：http://jsfiddle.net/kQpfE/268/