javascript - 使用 JQuery 排序功能对 DOM 元素进行排序时丢失单击
问题描述
在对动态 DOM 结构进行排序时,我遇到了一个非常奇怪的问题,动态是指我正在排序的结构中会有内容进出。所以我正在做的是每 500 毫秒运行两个函数,以便在所有新的 DOM 元素进入后立即对其进行重新排序。
我这样做是因为我无法在 DOM 中对数据进行排序(所以请保存您的“这不是正确的做事方式”评论,我知道,我别无选择)。
排序工作正常,事情是最初所有这些DOM元素(基本上是一个有很多孩子的父DIV)当你点击它们时打开一个弹出窗口,一旦我应用排序功能,当我点击时没有任何反应在他们身上,我的猜测是因为整个 DOM 重新排序非常快,因为总是重新运行排序功能,有些东西会丢失,我只是不知道如何修复它。
这是用于为每个 div 行分配优先级然后按该优先级重新排序元素的 JQuery:
$(document).ready(function () {
setInterval(function () {
//Incoming Chat Structure Variables
var $incomingChatsTable, $incomingChatsRows, $incomingChatTags
$incomingChatsTable= $("div[__jx__id*='incoming_list__list_content_container']")
$incomingChatsRowsContainer=$("div[__jx__id='___$_194__visitor_list__incoming_list__list__content']")
$incomingChatsRows = $("div[class*='renderers_Incoming']")
$incomingChatTags = $( "div[__jx__id*='incoming_list__list__content'] div[class*='renderers_Incoming'] .visitorlist_tags .jx_ui_html_span:last-child .tag").toArray()
//Assigning Priorities Function
function assignPriority(arrayParent) {
for ( var i=0; i <= arrayParent.length; i++) {
var actualRow = $(arrayParent[i])
var minutesInQueue = $(actualRow).find('.time_cell').text().substr(0,2)
var priorityVal = parseInt(minutesInQueue)
var actualRowTags = $( actualRow ).find('.tag').toArray()
$(actualRow).addClass('priorityRow')
for (var k=0; k <= actualRowTags.length; k++) {
let normalHolderTag = $(actualRowTags[k]).text().toLowerCase()
if (normalHolderTag === 'vip') {
priorityVal += 30
$(actualRow).attr('data-priority', priorityVal)
} else if ( normalHolderTag === 'rg' ) {
priorityVal += 20
$(actualRow).attr('data-priority', priorityVal)
} else if ( normalHolderTag === 'accountclosure' ) {
priorityVal += 10
$(actualRow).attr('data-priority', priorityVal)
} else {
$(actualRow).attr('data-priority', priorityVal)
}
$(actualRow).find('.numbers_cell').text(priorityVal)
}
}
}
//Sorting Incoming Chats By Priority
function orderByPriority(container) {
var myArray = container.find('.priorityRow')
myArray.sort(function(a,b){
contentA = parseInt( $(a).data('priority') )
contentB = parseInt( $(b).data('priority') )
return (contentB - contentA)
}).prependTo( container )
}
setInterval(function () {
assignPriority( $incomingChatsRows )
orderByPriority( $incomingChatsRowsContainer )
}, 500)
}, 500)
})
解决方案
推荐阅读
- javascript - 什么可能导致 Electron 不显示任何错误?
- google-cloud-platform - ValueError: 目标尺寸 (torch.Size([64, 3])) 必须与输入尺寸 (torch.Size([32, 3])) 相同
- javascript - 无法读取长度未定义的属性
- javascript - Suitelet 请求给出错误请求 400
- java - Mybatis null 配置对象里面自定义 TypeHandler
- javascript - 加载文件名中带有空格的文件内容
- c - 如何打印整个链表?
- python - 如何创建 Cifar-10 子集?
- javascript - Javascript日期函数调用下一个函数
- python - 有没有办法利用 R 中数据框中的列中的值(来自 python 代码的示例)创建矩阵?