javascript - Javascript按钮单击+显示

Question

我有一个大红色按钮，我正在尝试使用 javascript 执行以下操作：-

1. OnMouseDown 更改图像，使按钮看起来很压抑
2. OnMouseUp 返回初始图像并显示隐藏的 div

我可以让 onMouse Down 和 onMouseUp 图像更改部分工作。

我还可以通过使用 OnClick 来显示隐藏的 div

问题是我不能让它们一起工作。

我该怎么做呢？

顺便说一句，我确信它很明显，但我对 javascript 还很陌生，所以我很感谢你的帮助

Answer 1

您可以使用分号分隔事件中的多个脚本语句：

<img src="..." alt="..."
  onmousedown="depressed();"
  onmouseup="undepressed(); revealDiv();" />

另外，我相信大多数浏览器都支持 onclick 事件：

<img src="..." alt="..."
  onmousedown="depressed();"
  onmouseup="undepressed();"
  onclick="revealDiv();" />

既然你说你已经分别弄清楚了这三个部分，我只是编写了函数调用，你可以用你自己的代码替换每个步骤。

Answer 2

没有看到您的代码，很难说，但我怀疑缺少“返回真”；onclick 或 onmouseup 事件处理程序末尾的语句。

Answer 3

从不建议使用属性表示法将事件直接附加到 html 元素的标签。

将视图（作为呈现的 html）与控制器（正在发生的操作）分开是一种更好的做法

附加事件的最佳方式如下：

<img id="abut" />

<script>
var thebutton = document.getElementById('abut'); //Retrieve the button from the page 
thebutton.onmousedown = depressed; //depressed is a function that you declare earlier on...here, you are just passing a reference to it
thebutton.onmouseup = function () {
    undepressed();
    revealDiv(); //Invoke the two functions when the 'onmouseup' is triggered'
};
</script>