javascript - 对两个图像使用一个函数

Question

考虑以下标记

<div class="like-buttons">
  <img src="up.png" onclick="onClick()" />
  <span id="clicks">0</span>
  <img src="down.png" onclick="onClick()" />
 </div>

和下面的 JavaScript 函数

<script type="text/javascript">
    var clicks = 0;
    function onClick() {
        if (clicks < 10) {
            clicks += 1;
            document.getElementById("clicks").innerHTML = clicks;
        } else {
            document.getElementById("clicks").innerHTML = clicks;
        }
    };
</script>

现在我要实现的是，当单击 Up 图像时，计数会增加 1，最大值为 10，而当单击 down 时，计数会增加下降 1，不应低于 0。目前计数上升，但我想知道是否有一种方法可以在同一函数中为每个图像添加一个事件，或者我是否必须编写两个单独的函数，一个用于每个图像？

预先感谢您的帮助

Answer 1

使用参数调用 onClick() 函数，例如onClick(1)(向上按钮)和 onClick(-1) 向下按钮。

function onClick(value) {
    var clicks = parseInt(document.getElementById("clicks").innerHTML);
    clicks += value;
    if (clicks > 10)
        clicks = 10;
    if (clicks < 0)
        clicks = 0;
    document.getElementById("clicks").innerHTML = clicks;
}