Question

我正在尝试为ToolTip编写代码，当鼠标移过它时，文本显示，当它移开时，它会消失。我试图通过更改类来实现这一点（css中的tipHide有display:none，而tipShow有display: block），但onmouseout事件没有＆{ ＃39; t将类改回（我知道之后看到生成的源）。

如何解决此问题，以便onmouseout事件在onmouseover事件已经更改了类时触发。

我的HTML：

<div id="zha" class="cfield">
    <p id="qmark"></p>
    <p id="toolTip" class="tipHide">Text Shown</p>
</div>

和JavaScript：

function toolTip() {           
    document.getElementById('qmark').onmouseover = function() {
        var toolTip = document.getElementById('toolTip');
        toolTip.className = 'tipShow';
    }
    document.getElementById('qmark').onmouseout = function() {
        var toolTip = document.getElementById('toolTip');
        toolTip.classname = 'tipHide';
    }
}

我还想不使用JQuery

Answer 1

可能是className属性的拼写错误？在你的onmouseout中，你得到了这个：

toolTip.classname = 'tipHide';

应该是（与onmouseover上的相同）：

toolTip.className = 'tipHide';
             ^

JavaScript：onmouseout事件在onmouseover之后无法正常工作

1 个答案: