0

我在 HTML 表中有一个字段，用户可以在其中编辑值。当用户单击该字段的一个单元格时，该单元格上会出现一个文本区域，用户可以编辑他想要的任何内容，当他在该文本区域之外单击时，它会返回到正常文本。你知道的，标准的东西。

文本区域编辑器

所有这些都与onfocus和onblur事件一起正常工作，除了一件事：当我在文本区域内单击时（例如：我想通过在两个字母之间单击来编辑文本的某个部分），仍然调用onblur事件，从而关闭文本区域，这不是我想要的。

我很难理解为什么要调用该事件。这是我听说的称为事件传播的现象吗？我该如何解决或修复此行为？

这是我与情况相关的代码（稍微减轻了一点）：

Javascript

// Create a function that updates a table cell once the textarea loses focus (do not be confused with "losing its Ford Focus")
function createBlurFunction( cell, textArea, functionName ) {
    return function() {

        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function() {

            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {

                var result = JSON.parse(xmlhttp.responseText)[0];

                /* Do stuff with AJAX result */
            }
        }

        // Empty cell
        cell.innerHTML = "";

        // Send AJAX request
        xmlhttp.open("GET","Some AJAX parameters", true);
        xmlhttp.send();
    }
}

// textArea is already defined somewhere else
textArea.addEventListener('blur', createBlurFunction( cell, textArea, cell.title ), false);

谢谢！

编辑 1：

我在网页的其他地方使用了类似的结构（当您在外部单击时会消失的文本区域）并且行为不同：当我在其中单击时文本区域不会消失。

但是，我从上面的代码中使用了复制/粘贴，所以我可能怀疑代码错误或其他什么......

4

1 回答 1

1

You could put the blur function on a timeout and in your focus listener clear the timeout.

var timer;
function createBlurFunction() {
    var myFunc = function() { ... }
    return function() {timer = setTimeout(myFunc(),300);};
}

function myFocusFunction() {
    clearTimeout(timer);
    //do stuff
}
于 2013-06-12T15:17:55.283 回答