Javascript/jQuery - 当鼠标按下和向上时改变输入按钮的背景图像

Question

我想在鼠标按下和抬起时更改输入按钮的背景图像，但它不起作用。

function mousedown() {
  document.getElementById("enlarge_btn").style.backgroundImage = "url(../picture/image2.svg)";
}

function mouseup() {
  document.getElementById("enlarge_btn").style.backgroundImage = "url(../picture/image1.svg)";
}

.button_img {
  width: 36px;
  height: 36px;
  background-image: url(../picture/image1.svg);
  background-color: transparent;
  background-size: cover;
  border: none;
  cursor: pointer;
}

<input id="enlarge_btn" type="button" name="button" class="button_img" onmousedown="mousedown()" onmouseup="mouseup()">

我可以在哪里修复？

请帮帮我，谢谢！

Answer 1

我发现如果我改变

document.getElementById("enlarge_btn").style.backgroundImage = "url(../picture/image2.svg)";

至

document.getElementById("enlarge_btn").style.backgroundImage = "url(picture/image2.svg)";

有效，所以问题出在文件路径上。

谢谢。

Javascript/jQuery - 当鼠标按下和向上时改变输入按钮的背景图像

Javascript/jQuery - Change input button the background image when mouse down and up

html

javascript

button

background-image

mousedown