javascript - 如果不是鼠标悬停，如何添加默认文本字段？

Question

这里是 JS 新手。我有一个带有一些鼠标悬停功能的表格，其中有一个小脚本用于将文本输出到表格的右侧。

我很好奇是否有一种方法可以在用户将鼠标移开后设置默认文本。现在，一旦您将鼠标悬停在该项目上，输出就会保持上次鼠标悬停的状态。

由于这些都在表格中，我只是显示它的焦点。

function writeText2(txt2) {
  document.getElementById("text_field2").innerHTML = txt2;
}

    <div onmouseover="writeText2('the div works fine')">
      MOUSE OVER DIV
  </div>
  <td>
    <p id="text_field2">
      Prefer this to stay as default text if user moves mouse off the td above
    </p>
  </td>
  <td onmouseover="writeText2('the td works fine')">
      MOUSE OVER TD
  </td>

Answer 1

您只需要mouseout事件。

虽然使用这样的内联事件监听器并不是一个好习惯，因为您已经开始这样做了:

function writeText2(txt2)
{
document.getElementById("text_field2").innerHTML=txt2; 
}

    <p align="center" style="padding:0px 7px" onmouseover="writeText2('happy happy text text')" onmouseout="writeText2('My default text here')" id="text_field2">MOUSEOVERHERE</p>

(请注意，我已将 <td> 更改为 <p> 以使代码片段正常工作。我还将 id 添加到元素中，以显示它正常工作 - 您显然必须适应根据您自己的用例，您的目标元素与鼠标进入和离开的元素不同。)