jquery 动态生成的input添加change事件

借助js的on方法,可以给动态生成的input标签,添加change事件

1     //我的费率
2     $(document).on("input propertychange", "#mytbody .my_rate", function (e) {
3         var my_rate = $(this).val();
4         var obj = $(this).parent().parent();
5         var child_rate = $(obj.find('.child_rate')[0]).val();
6         $(obj.find('.left_rate')[0]).val(parseFloat(my_rate)-parseFloat(child_rate));
7     });

这是动态生成的html结构

 1 <table id="table" class="table table-striped table-bordered table-hover table-nowrap" width="100%">
 2         <thead>
 3         <tr>
 4             <th style="text-align: center; vertical-align: middle;" width="3%"><div class="th-inner">ID</div><div class="fht-cell"></div></th>
 5             <th style="text-align: center; vertical-align: middle;" width="10%"><div class="th-inner ">产品名称</div><div class="fht-cell"></div></th>
 6             <th style="text-align: center; vertical-align: middle;" width="5%"><div class="th-inner ">产品分类</div><div class="fht-cell"></div></th>
 7             <th style="text-align: center; vertical-align: middle;" width="5%"><div class="th-inner ">保费</div><div class="fht-cell"></div></th>
 8             <th style="text-align: center; vertical-align: middle;" width="3%"><div class="th-inner ">总服务费率</div><div class="fht-cell"></div></th>
 9             <th style="text-align: center; vertical-align: middle;" width="3%"><div class="th-inner ">下级分销服务费率</div><div class="fht-cell"></div></th>
10             <th style="text-align: center; vertical-align: middle;" width="3%"><div class="th-inner ">剩余自留费率</div><div class="fht-cell"></div></th>
11             <th style="text-align: center; vertical-align: middle;" width="3%"><div class="th-inner ">操作</div><div class="fht-cell"></div></th>
12         </tr>
13         </thead>
14         <tbody id="mytbody">
15              <tr id="0-id">
16                 <td style="text-align: center; vertical-align: middle;" id="22-myid" data-value="22">22</td>
17                 <td style="text-align: center; vertical-align: middle;" id="22-myname" data-value="京彩一生百万医疗">京彩一生百万医疗</td>
18                 <td style="text-align: center; vertical-align: middle;" id="22-jq_category_name" data-value="意外险">意外险</td>
19                 <td style="text-align: center; vertical-align: middle;" id="22-premium" data-value="0.00">0.00</td>
20                 <td style="text-align: center; vertical-align: middle;"><input class="form-control my_rate" type="number" id="22-my_rate" value="15"></td>
21                 <td style="text-align: center; vertical-align: middle;"><input class="form-control child_rate" type="number" id="22-child_rate" value="8"></td>
22                 <td style="text-align: center; vertical-align: middle;"><input class="form-control left_rate" type="number" id="22-left_rate" value="5"></td>
23                 <td style="text-align: center; vertical-align: middle;" class="mydel" data-id="0">删除</td>
24             </tr>
25             <tr id="1-id">
26                 <td style="text-align: center; vertical-align: middle;" id="27-myid" data-value="27">27</td>
27                 <td style="text-align: center; vertical-align: middle;" id="27-myname" data-value="平安一生">平安一生</td>
28                 <td style="text-align: center; vertical-align: middle;" id="27-jq_category_name" data-value="健康险">健康险</td>
29                 <td style="text-align: center; vertical-align: middle;" id="27-premium" data-value="100000.00">100000.00</td>
30                 <td style="text-align: center; vertical-align: middle;"><input class="form-control my_rate" type="number" id="27-my_rate" value="20"></td>
31                 <td style="text-align: center; vertical-align: middle;"><input class="form-control child_rate" type="number" id="27-child_rate" value="5"></td>
32                 <td style="text-align: center; vertical-align: middle;"><input class="form-control left_rate" type="number" id="27-left_rate" value="5"></td>
33                 <td style="text-align: center; vertical-align: middle;" class="mydel" data-id="1">删除</td>
34             </tr>
35          </tbody>
36     </table>

使用bind方法不行,具体,on和bind和区别自行百度吧,我也不明白

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值