动态渲染fieldlist后追加按钮无效
使用Fieldlist组件进行动态渲染后,追加的按钮无法响应点击事件。
解决方案
为了解决此问题,需要在渲染完新元素后,使用事件委托给动态添加的按钮绑定点击事件。
演示代码
// 在文档加载后绑定点击事件 $(document).ready(function() { // 为追加按钮添加点击事件 $(document).on('click', '.btn-append', function(event) { event.preventDefault(); console.log('Append button clicked'); // 追加新元素的逻辑 $('table.fieldlist').append('<tr><td colspan="8"><a href="#" class="btn btn-sm btn-danger btn-remove"><i class="fa fa-times"></i> Remove</a></td></tr>'); }); // 为动态添加的删除按钮绑定事件 $(document).on('click', '.btn-remove', function(event) { event.preventDefault(); $(this).closest('tr').remove(); }); });
以上就是动态渲染 Fieldlist 后按钮失效?如何解决?的详细内容,更多请关注php中文网其它相关文章!
版权声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系 yyfuon@163.com