Chrome + jQuery:Div不爽快？

Question

我有这个代码:

var clickHandler = function(e) {
    var el = e.target;
    if(el == $highlightBox[0]) {
        $highlightBox.hide();
        el = document.elementFromPoint(e.clientX, e.clientY);
        $highlightBox.show();
    }
    $frame.append(getSelector(el) + '<br/>');
}

当我单击一个元素时,它会添加一些文本$frame(这只是一个div).问题是,在鼠标悬停之前,它不会刷新.如何强制刷新？

Answer 1

我在使用 Chrome 和 jQuery 时遇到了类似的问题，我正在获取一个元素，通过以下方式填充其内容$('#myElem').html(content);

我发现 div 的实际 insideHtml 已正确更新，但屏幕没有刷新。我可以突出显示 div 中的文本，并看到我最初看到的内容（旧的不正确文本）实际上只是仍在屏幕上的工件，但突出显示的文本是应该覆盖的正确文本原本的。

最简单的修复方法是强制页面刷新整个控件。我通过修改实际元素的外观来做到这一点。

这是对我有用的修复示例（使用您的代码）：

var clickHandler = function(e) {
    var el = e.target;
    if(el == $highlightBox[0]) {
        $highlightBox.hide();
        el = document.elementFromPoint(e.clientX, e.clientY);
        $highlightBox.show();
    }
    $frame.append(getSelector(el) + '<br/>');

    // My Add to force re-rendering of control
    $frame.height($frame.height() + 1);  // re-renders control
    $frame.height($frame.height() -1);   // resets to original height
}