onFocus 和 onBlur答案

【问题标题】：onFocus and onBluronFocus 和 onBlur
【发布时间】：2020-10-30 07:12:00
【问题描述】：

由于某种原因，onblur 和 onfocus 属性不起作用。我对它们的定义正确吗？

var replyTxt = document.createElement("input");
    replyTxt.id="replyTxt";
    replyTxt.type="text";
    replyTxt.value="Write a reply";
    
    replyTxt.onfocus = function(){if(replyTxt.value==replyTxt.defaultValue) replyTxt.value='';};
    replyTxt.onblur= function(){if(replyTxt.value=='') replyTxt.value=replyTxt.defaultValue;};

我也尝试过将"function(){if(replyTxt.value==replyTxt.defaultValue) replyTxt.value='';}" 放在引号中

【问题讨论】：

其实应该可以的。不知道为什么不行？？
没有设置默认值。在匿名函数内部也完成了某种闭包，其中this.value 将是比replyTxt.value 更好的选择

标签： javascript dom-events onblur onfocus

【解决方案1】：

事件有效 - 所以你的逻辑可能有问题......

if(replyTxt.value==replyTxt.defaultValue) replyTxt.value='';

你在哪里设置replyTxt.defaultValue？在您的示例中，您没有 - 所以逻辑永远不会触发。试试这个...

var replyTxtDefaultText = "Write a reply";
var replyTxt = document.createElement("input");
    replyTxt.id="replyTxt";
    replyTxt.type="text";
    replyTxt.value=replyTxtDefaultText;

    replyTxt.onfocus = function(){if(replyTxt.value==replyTxtDefaultText) replyTxt.value='';};
    replyTxt.onblur= function(){if(replyTxt.value=='') replyTxt.value=replyTxtDefaultText;};

【讨论】：

使用这个。而不是函数中的replyTxt 是正确的方法。

【解决方案2】：

只是一个提示：尝试在事件函数中将 replyTxt 替换为 this。

【讨论】：

这很重要！但无论如何，它似乎确实有效。也许关闭？

【解决方案3】：

试试setAttribute。更多关于函数的信息看看这个link

var replyTxt = document.createElement("input");
replyTxt.setAttribute('onFocus', 'focusFunction()');

function focusFunction()
{
   if(replyTxt.value==replyTxtDefaultText) 
      replyTxt.value='';
}

【讨论】：

为什么要将函数调用包装在字符串中？不要那样做。曾经。再次。

【解决方案4】：

并确保将其附加到某些东西上。

<form id="x">
</form>
<script>
window.onload=function() {
  var replyTxt = document.createElement("input");
  replyTxt.id="replyTxt";
  replyTxt.type="text";
  replyTxt.value=replyTxt.defaultValue="Write a reply";
  replyTxt.onfocus = function(){if(this.value==this.defaultValue) this.value='';};
  replyTxt.onblur= function(){if(this.value=='') this.value=this.defaultValue;};

  document.getElementById('x').appendChild(replyTxt);
}
</script>

【讨论】：

【解决方案5】：

实际上，我正在处理与家庭作业类似的问题，我发现最好在鼠标落在场地上时立即清除场地，而不是在未触及的情况下进行比较然后清除它。

【讨论】：