Question

我有一个名为changeImage的函数，我想只更改我点击的按钮。
我怎样才能做到这一点？我不认为硬代码是解决方案。我正在使用PHP和JavaScript。 *我有大约100个按钮，每个按钮都有自己的ID，例如：A1，A2，B1，B2

我的代码：

<script type="text/javascript">
        function changeImage() {
            var image = document.getElementById('A1');
            if (image.src.match("Grey")) {
                image.src = "Image/Yellow.png";
            } else {
                image.src = "Image/Grey.png";
                return false;
        }
    }</script>
<input id="A1" type="image" src="Image/Grey.png" onclick="changeImage()">
<input id="A2" type="image" src="Image/Grey.png" onclick="changeImage()">
<input id="B1" type="image" src="Image/Grey.png" onclick="changeImage()">
<input id="B2" type="image" src="Image/Grey.png" onclick="changeImage()">

Answer 1

请改用此代码：

<script type="text/javascript">
    function changeImage(e) {
        var image = e;
        if (image.src.match("Grey")) {
            image.src = "Image/Yellow.png";
        } else {
            image.src = "Image/Grey.png";
            return false;
        }
    }
</script>

<input id="A1" type="image" src="Image/Grey.png" onclick="changeImage(this)">
<input id="A2" type="image" src="Image/Grey.png" onclick="changeImage(this)">
<input id="B1" type="image" src="Image/Grey.png" onclick="changeImage(this)">
<input id="B2" type="image" src="Image/Grey.png" onclick="changeImage(this)">

Answer 2

因此，不要使用this命令调用某个id。就像点击此按钮一样，更改其来源

   function changeImage(button) {   //button = this onclick="changeImage(button)";
        if (button.src.match("Grey")) {
            button.src = "Image/Yellow.png";
        } else {
            button.src = "Image/Grey.png";
            return false;
        }
    }

签入JSFiddle

Answer 3

通过函数参数传递一个变量，并在函数内部进行拾取，如下所示：https://stackoverflow.com/a/6575272/1864597。

如果您不需要传递任何变量（并希望保持清洁），请使用@developer的答案。

Onclick事件对特定按钮起作用

3 个答案: