Question

我有以下HTML和下面的java脚本来模拟单击链接块时的背景颜色变化，但它似乎不起作用。有什么理由吗？

如果我只处理了onmousedown事件，背景颜色肯定会变为蓝色。但如果处理了onmousedown和onmouseup，那么任何东西都不会在视觉上发生变化。

<div class='Button'><a href='mylink' onmousedown=\"changeColorOnMouseDown();\"  onmouseup=\"changeColorOnMouseUp();\"><span id='note'>note...</span></a></div>


function changeColorOnMouseDown()
{
    document.getElementById('note').style.background='blue';
}

function changeColorOnMouseUp()
{
    document.getElementById('note').style.background='#d8dde7';
}

Answer 1

试试这个：

<div class="Button"><a href="#" onMouseDown="changeColorOnMouseDown();"  onMouseUp="changeColorOnMouseUp();"><span id="note">note...</span></a></div>


function changeColorOnMouseDown()
{
    document.getElementById('note').style.backgroundColor = 'blue';
}

function changeColorOnMouseUp()
{
    document.getElementById('note').style.backgroundColor = '#d8dde7';
}

Answer 2

除了Sarfraz建议的内容（style.backgrounColor vs style.background）之外，您不需要在事件中转义函数调用的引号：

<a href='mylink' onmousedown="changeColorOnMouseDown();"  onmouseup="changeColorOnMouseUp();">

用户单引号或双引号。同样，无需转义引号（\“）。

单击链接时模拟更改背景颜色

2 个答案: