JokerRush 2019-07-30 18:01 采纳率: 0%
浏览 463
已采纳

Thymeleaf异步请求发生灵异事件?

thymeleaf进行异步请求局部刷新页面后,checkbox的事件失效。

页面截图:

图片说明

<!-- HTML-->
<td class="col-lg-1">
        <input type="checkbox" name="cacheAllRoles"/>
</td>

<!-- JS-->
<script type="text/javascript">
    // 全选\全不选 cacheAllRoles

    $("input[name='cacheAllRoles']").on("click", function () {
            if ($(this).is(':checked')) {
                    $('input[name="roleCheck"]').each(function () {
                            $(this).prop("checked", true);
                    });
            } else {
                    $('input[name="roleCheck"]').each(function () {
                            $(this).prop("checked", false);
                    });
            }
    });
</script>

页面初始化完成时,该事件是可用的;
当异步请求成功后,页面刷新完成,的事件失效。

我不知道我的问题描述的是否详细,反正就是很灵异。
前端白痴,不知道怎么排查......

补充说明:这部分是异步请求的代码

<!-- Role Table -->
<div class="col-lg-4">
<div id="roleTable" th:fragment="roleTable">
<table class="table table-striped">
<thead>
<tr>
<td class="col-lg-1">
<input type="checkbox" name="cacheAllRoles"/>
</td>
<td class="col-lg-1">ID</td>
<td class="col-lg-2" width="">角色名称</td>
<td class="col-lg-2">描述</td>
<td class="col-lg-2">配置</td>
</tr>
</thead>
<tbody>
<tr th:each="roles:${roleList}">
<td>
<input type="checkbox" th:checked="${roles.configFlag}" th:value="${roles.roleId}" name="roleCheck">
</td>
<td th:text="${roles.roleId}"></td>
<td th:text="${roles.roleName}"></td>
<td th:text="${roles.roleDescription}"></td>
<td>config</td>
</tr>
</tbody>
</table>
</div>
</div>

//获取角色列表
function configRole(userId, username) {
$("#roleTable").load("/urpCfgCtrl/getRoleListByUserId", {"userId": userId});
}
  • 写回答

1条回答 默认 最新

  • space1103 2019-07-31 09:55
    关注

    我现在猜想有可能是因为你的$("input[name='cacheAllRoles']")这个是动态创建出来的,所以绑定事件需要用$("body").on("click","input[name='cacheAllRoles']",function(){});

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 有没有人会打学生成绩管理系统呀
  • ¥15 在使用Fiddler和夜神模拟器抓包的时候一直出现443该怎么办啊QAQ搜了好几个笔记都没有解决
  • ¥15 3x7的二维数组A、B、C,A中的任意1个数组元素与B的任意1个数组元素、同时又与C的任意1个数组元素比较,把不同位置出现相同数的比较称为无意义,反之称为有意义,把有意义的比较打印输出。
  • ¥20 预测模型怎么处理原始数据(随机森林)
  • ¥20 请问discuz3.5如何实现插入ckplayer全能播放器功能呢?
  • ¥15 thingsboard代码编译出错误
  • ¥15 博途v18仿真报错怎么解决
  • ¥15 欧姆龙plc枕式包装机 ST编程
  • ¥15 为啥快手广告联盟的广告这么难出来
  • ¥15 k8s集群重启后,kubelet一直报systemctl restart kubelet.service "Failed to delete cgroup paths"