无法在 javascript 中读取 HTMLDocument.catchIt 中 null 的属性 'nodeName'



所以我有一个简单的代码,告诉如果有一个段落,用户点击它,它应该显示文本字段和按钮。当您在文本字段中输入信息并转到时,文本字段中的值应更改为文本字段值。我的代码运行良好,但出现错误。无法在HTMLDocument.catchIt中读取null的属性"nodeName"。有人能告诉我如何解决吗?

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<p>jobgo</p>
<script type="text/javascript">
var editing  = false;
if (document.getElementById && document.createElement) {
var butt = document.createElement('BUTTON');
var buttext = document.createTextNode('Ready!');
butt.appendChild(buttext);
butt.onclick = saveEdit;
}
function catchIt(e) {
if (editing) return;
if (!document.getElementById || !document.createElement) return;
if (!e) var obj = window.event.srcElement;
else var obj = e.target;
while (obj.nodeType != 1) {
obj = obj.parentNode;
}
if (obj.tagName == 'TEXTAREA' || obj.tagName == 'A') return;
while (obj.nodeName != 'P' && obj.nodeName != 'HTML') {
obj = obj.parentNode;
}
if (obj.nodeName == 'HTML') return;
var x = obj.innerHTML;
var y = document.createElement('TEXTAREA');
var z = obj.parentNode;
z.insertBefore(y,obj);
z.insertBefore(butt,obj);
z.removeChild(obj);
y.value = x;
y.focus();
editing = true;
}
function saveEdit() {
var area = document.getElementsByTagName('TEXTAREA')[0];
var y = document.createElement('P');
var z = area.parentNode;
y.innerHTML = area.value;
z.insertBefore(y,area);
z.removeChild(area);
z.removeChild(document.getElementsByTagName('button')[0]);
editing = false;
}
document.onclick = catchIt;</script>
</body>
</html>

您在整个文档上附加了onclick事件,并且正在处理该函数中的所有内容。现在,当它是TextArea或锚点标记时,您正确地返回了,但忘记了为BUTTON标记返回。

由于您为按钮附加了一个名为saveClick((的onclick处理程序,它正在执行您想要的实际工作,因此您的代码可以按预期工作。当您有一个按钮时,您只需要从另一个onclick事件处理程序(catchit(返回。像这样编辑,它会工作:

if (obj.tagName == 'TEXTAREA' || obj.tagName == 'A' || obj.tagName == 'BUTTON') return;

最新更新