我的系统每 500 毫秒获取一次数据,并且我的屏幕上充满了彼此分开的 html 表格。每个单元格都有唯一的关键属性。无论如何,我都在缓存它们。
我有一个全局 JavaScript 对象(_cellColorTimeouts),其中包含我上面提到的 tableRows 的 cellElements 的 settimeout 函数。缓存单元格后,系统会创建超时函数,用于清除特定单元格的 css(在 3000 毫秒内)。
在下面的代码块中, uiElementKey_X 和 uiElementKey_Y 完全相同,但缓存却不同。将唯一的后缀添加到表 id 中会使它们不同。此过程也适用于行和单元格项目。
_cellColorTimeouts 数据的示例是
//array object keys are names of unique cell items.
_cellColorTimeouts = [uiElementKey_X_1, uiElementKey_X_2, uiElementKey_X_3,
uiElementKey_Y_1, uiElementKey_X_2, uiElementKey_Y_3];
.
. //does somethings to change cell colour
.
//after 3 seconds i need to clear css of this cell without looping the dom so i do it via cached dom.
if (_cellColorTimeouts.hasOwnProperty(uiElementKey) && _cellColorTimeouts[uiElementKey] != null) {
clearTimeout(_cellColorTimeouts[uiElementKey]);
_cellColorTimeouts[uiElementKey] = null;
}
_cellColorTimeouts[uiElementKey] = setTimeout(function () {
clearColourOfCell(cell);
}, 3000);
}
function clearColourOfCell(cell) {
cell.style.backgroundColor = cell.rowBGColour;
cell.style.color = "black";
_cellColorTimeouts[cell.uiElementKey] == null;
clearTimeout(_cellColorTimeouts[cell.uiElementKey]);
}
所以问题是 settimeout 函数不适用于第一个表,但第二个完全没问题。我检查了是否有任何 settimeout 函数从全局返回 id,是的。对于第一张桌子不知何故它不起作用。我知道这个问题对我的情况来说太独特了,但有什么想法会受到重视吗?
---- 编辑 ---- 全功能未删减版 -----
function setWidgetData(widgetId, rowId, colId, value, colIndex) {
"use strict";
// check colIndex
if (colIndex === undefined || colIndex === null) {
colIndex = 0;
}
// loop on ui tables
var uiTables = _widgetUIElements[widgetId];
//var timeout;
for (var tableId in uiTables) {
var uiTable = uiTables[tableId];
var uiElementKey = tableId + "#" + rowId + "#" + colId + "#" + colIndex;
var cellCachedObject = uiTable[uiElementKey];
// check cell
if (cellCachedObject == undefined) {
//console.log("cell is undefined : " + "widgetId : " + widgetId + " - " + "rowId : " + rowId + " - " + "colId : " + colId + " - " + "colIndex : " + colIndex);
}
else {
// get cell
var cell = cellCachedObject["domElement"];
// set sell value
var cellValue = value;
// is value numeric? it means we will make some conversions on value
if (isNumeric(cellValue)) {
var canPaint = false;
// check cell entity
switch (cellCachedObject["entity"]) {
// date-time?
case "DATETIME":
// convert unix date time to readable date time
cellValue = new Date(fixDecimalSeparator(cellValue) * 1000);
cellValue = fixDateTimeDigits((cellValue.getDate())) + "/" + fixDateTimeDigits((cellValue.getMonth() + 1)) + " " + fixDateTimeDigits(cellValue.getHours()) + ":" + fixDateTimeDigits(cellValue.getMinutes());
break;
// date?
case "DATE":
// convert unix date time to readable date time
cellValue = new Date(fixDecimalSeparator(cellValue) * 1000);
cellValue = fixDateTimeDigits((cellValue.getDate())) + "/" + fixDateTimeDigits((cellValue.getMonth() + 1));
break;
// numeric?
case "NR":
// fix "," character in value
cellValue = fixDecimalSeparator(cellValue);
//just format the presicion
cellValue = number_format(cellValue, cellCachedObject["precision"], '.', ',');
canPaint = true;
break;
// other?
default:
// fix "," character in value
cellValue = fixDecimalSeparator(cellValue);
// if cell is number, no entity conversion
// entity convertion
cellValue = entityConverter(cellCachedObject["entity"], cellCachedObject["entityTo"], cellValue);
cellValue = new Number(cellValue).toFixed(cellCachedObject["precision"]);
// if widget currency is not USD. it means user selected currency from currency list or default user currency
if (cellCachedObject["isConvertable"]) {
// this scoop is not active with the new xml. if FOREX1 widget entity is RECIPCUR but never should not be
if (cellCachedObject["widgetIsFOREX1"]) {
cellValue = _currencyConverter.convertTrend(cellValue, cellCachedObject.currencyValueType, cellCachedObject["currencyTo"], cellCachedObject["rowId"], cellValue);
}
else {
cellValue = _currencyConverter.convert(cellValue, cellCachedObject["currency"], null, cellCachedObject["precision"]);
}
}
canPaint = true;
}
// if it is not date time
if (canPaint) {
// get current value of cell
var currentValue = cell.getAttribute("currentValue");
// check current value of cell make them coloured.
if (currentValue !== undefined) {
// new value is bigger than old value
var newVal = parseFloat(value);
var oldVal = parseFloat(currentValue);
var rowBGColour = cellCachedObject["rowBGColor"];
cell.rowBGColour = rowBGColour;
cell.uiElementKey = uiElementKey;
if (newVal > oldVal) {
//cell.css({ "background-color": "Green", "color": "White" });
cell.style.backgroundColor = "green";
cell.style.color = "white";
}
// new value is smaller than old value
if (newVal < oldVal) {
//cell.css({ "background-color": "Red", "color": "White" });
cell.style.backgroundColor = "red";
cell.style.color = "white";
}
if (_cellColorTimeouts.hasOwnProperty(uiElementKey) && _cellColorTimeouts[uiElementKey] != null) {
clearTimeout(_cellColorTimeouts[uiElementKey]);
_cellColorTimeouts[uiElementKey] = null;
}
_cellColorTimeouts[uiElementKey] = setTimeout(function () {
return function () {
clearColourOfCell(cell);
};
} (cell), 3000);
newVal = oldVal = rowBGColour = null;
}
currentValue = null;
}
canPaint = null;
// set new value as a current value
cell.setAttribute("currentValue", value);
}
cell.innerHTML = '';
cell.innerHTML = cellValue;
cellValue = null;
}
uiTable = uiElementKey = cellCachedObject = null;
}
uiTables = null;
}