NotFoundError：替換innerHTML時，DOM異常8

Question

我是js開發的新手。 我有以下代碼：

<html>
<body>

<div><span id="inline">Click here to start editing</span></div>

<script>
    var inline = document.getElementById("inline");     
    inline.onclick = function() {           
        if (!inline.editable) {
            var text = inline.innerText;
            inline.innerHTML = "<input type='text' id='inline-editable'>";
            inline.editable = true;
            var inline_editable = document.getElementById("inline-editable");
            inline_editable.value = text;

            inline_editable.onblur = function() {
                var value = inline_editable.value;                  
                inline.editable = false;
                inline.innerHTML = value;
            }

            inline_editable.onkeypress = function(event) {
                if (event.keyCode == 13) {
                    inline_editable.onblur();
                }
            }               
        }
    }
</script>
</body>

</html>

它顯示span內的一些文本並允許內聯編輯。 當我在onblur事件中完成編輯后，它的工作就很好了。 但是，如果我想通過Enter終止編輯並使用相同的處理程序，則會在此行中收到錯誤NotFoundError: DOM Exception 8 ：

inline.innerHTML = value;

不過，一切都按我的預期進行。 誰能幫助我避免此錯誤？

我認為發生這種情況是因為在事件處理未完成時我銷毀了可inline-editable元素，並且它可能想調用onchange 。 我是否應該一直有2個控件來切換其可見性？

提前致謝。

Answer 1

這里的問題是onblur觸發了兩次，第二次，元素不存在，這導致了問題。 殺死事件

var inline = document.getElementById("inline");     
inline.onclick = function() {

    if (!inline.editable) {
        var text = inline.innerText;
        inline.innerHTML = "<input type='text' id='inline-editable'>";
        inline.editable = true;
        var inline_editable = document.getElementById("inline-editable");
        inline_editable.value = text;

        inline_editable.onblur = function() {
            this.onblur = function(){};
            var value = this.value;
            inline.editable = false;
            inline.innerHTML = value;
        }

        inline_editable.onkeypress = function(event) {
            if (event.keyCode == 13) {
                this.onblur();                    
            }
        }               
    }
}

NotFoundError：替換innerHTML時，DOM異常8

問題描述

1 個解決方案

解決方案1
1 已采納 2013-06-10 14:08:47

NotFoundError：替換innerHTML時，DOM異常8

問題描述

1 個解決方案

解決方案1 1 已采納 2013-06-10 14:08:47

解決方案1
1 已采納 2013-06-10 14:08:47