单击里面时textarea模糊

Question

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

所有这一切都适用于 onfocus 和 onblur 事件，除了一件事：当我点击里面 textarea（例如。 ：我想通过点击两个字母来编辑文本的某个部分），仍然会调用 onblur 事件，从而关闭textarea，这不是我想要的。

我很难理解调用该事件的原因。这是我听说的事件传播这种现象吗？我该如何解决或解决此问题？

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

的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：

我在网页的其他地方使用了类似的结构（当你点击外面时，textarea会消失）并且行为不同：当我点击它时，textarea不会消失。

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

Answer 1

您可以将模糊功能设置为超时，并在焦点侦听器中清除超时。

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

function myFocusFunction() {
    clearTimeout(timer);
    //do stuff
}