xmSelect 1.2.4 版本 - 严格父子关系下实现父节点全选子节点功能
可以通过在on回调函数中监听点击事件,判断点击的节点是否为父节点,然后根据点击的节点状态进行相应的处理。\n\n首先,在on回调函数中添加一个点击事件监听:\n\n\non: function (data) {\n // 判断点击的节点是否为父节点\n if (data.isParent) {\n // 点击的是父节点,则判断父节点是否已经全选\n if (data.checkedAll) {\n // 父节点已经全选,则取消所有子节点的选中状态\n data.childs.forEach(function (child) {\n child.changeStatus(false);\n });\n } else {\n // 父节点未全选,则全选所有子节点\n data.childs.forEach(function (child) {\n child.changeStatus(true);\n });\n }\n } else {\n // 点击的是子节点,不做处理\n }\n\n // 更新结果到表单\n var ids = [];\n var parentIds = [];\n\n data.arr.forEach(function (item) {\n ids.push(item.value);\n\n if (item.parent != 0) {\n parentIds.push(item.parent);\n }\n });\n\n var uniqueIds = Array.from(new Set(ids));\n var uniqueParentIds = Array.from(new Set(parentIds));\n\n var combinedIds = uniqueIds.concat(uniqueParentIds).join(',');\n\n $('#industry').val(combinedIds);\n},\n\n\n在点击父节点时,判断父节点是否已经全选,如果已经全选,则取消所有子节点的选中状态;如果未全选,则全选所有子节点。\n\n然后,使用changeStatus方法来改变节点的选中状态,将子节点的选中状态设置为true或false。\n\n最后,更新结果到表单中。\n\n这样就实现了在严格遵守父子关系的情况下,点击父节点全选所有子节点,再次点击取消所有选中,可以单独取消选中子节点,在子节点全部取消的情况下父节点依然可以保持单独选中状态的功能。
原文地址: https://www.cveoy.top/t/topic/qfGS 著作权归作者所有。请勿转载和采集!