第三个JS函数将逗号更改为现有行上的点,但是当我使用第一个函数添加新行时,它对新行不起作用。我怎么能纠正这个?
<script type="text/javascript">
$(document).ready(function()
{
$("#addPurchase").click(function()
{
$("#tablePurchases tr:last").after('<tr>'+
'<td><input type="text" name="comment[]" style="width:250px;" maxlength="255" value="Hi!" /></td>'+
'<td><input type="text" name="do[]" style="width:70px; text-align:right;" value="0.00" /></td>'+
'<td><input type="text" name="dds[]" style="width:50px; text-align:right;" value="0.00" /></td>'+
'</tr>');
});
$("#removePurchase").click(function(){
if($("#tablePurchases tr").length>2) { $("#tablePurchases tr:last").remove();total(); };
});
$("#tablePurchases td:nth-child(2)").on('keyup',function(){
$(this).children().val($(this).children().val().replace(",", "."));
});
});
</script>
<a href="javascript:void(0);" id="addPurchase">Add</a>/
<a href="javascript:void(0);" id="removePurchase">Remove</a><br />
<table style="font-family:'Book antiqua';" id="tablePurchases"><tbody>
<tr align="center">
<th>Field1</th>
<th>Field2</th>
<th>Field3</th>
</tr>
<tr>
<td><input type="text" name="comment[]" style="width:250px;" maxlength="255" value="Hi!" /></td>
<td><input type="text" name="do[]" style="width:70px; text-align:right;" value="0.00" /></td>
<td><input type="text" name="dds[]" style="width:50px; text-align:right;" value="0.00" /></td>
</tr>
<tr>
<td><input type="text" name="comment[]" style="width:250px;" maxlength="255" value="Hi!" /></td>
<td><input type="text" name="do[]" style="width:70px; text-align:right; " value="0.00"/></td>
<td><input type="text" name="dds[]" style="width:50px; text-align:right; " value="0.00"/></td>
</tr>
</table>
答案 0 :(得分:1)
将事件绑定到动态创建的元素时,需要使用.on()的委托语法。
变化:
$("#tablePurchases td:nth-child(2)").on('keyup',function(){
$(this).children().val($(this).children().val().replace(",", "."));
});
为:
$('table').on('keyup', '#tablePurchases td:nth-child(2)', function(){
$(this).children().val($(this).children().val().replace(",", "."));
});