Question

我试图通过单击更改图像。我已经编写了代码，但无法正常工作。

<div class="img fadeIn" >
        <img src="logo.png" height="90px" width="320px" onclick="change()" id="koo" />
    </div>

JavaScript代码：

function change() {
var mySrc = this.getAttribute('src');
    if( mySrc == 'logo.png' ){
        this.setAttribute('src','logo1.png');
        } else {
        this.setAttribute('src','logo.png');
        }
    }

Answer 1

您必须将元素作为函数的参数。我已经附上了工作代码。

$MSISDN = $xpath->query("//ie[@name='GTP_V2_IE_MSISDN']");

function change(t) {
var mySrc = t.getAttribute('src');
    if( mySrc == 'logo.png' ){
        t.setAttribute('src','logo1.png');
        t.setAttribute('alt','logo1');
        } else {
        t.setAttribute('src','logo.png');
        t.setAttribute('alt','logo');
        }
    }

Answer 2

还有一种方法可以做到这一点。请参考代码

<div class="img fadeIn">
     <img src="logo.png" height="90px" width="320px" onclick="change()" id="koo" />
</div>

function change() {
    var imgTag = event.target;
    var mySrc = imgTag.getAttribute('src');
    if( mySrc == 'logo.png' ){
        imgTag.setAttribute('src','logo1.png');
    } else {
        imgTag.setAttribute('src','logo.png');
    }
}

Answer 3

尝试一下！

var ele = document.getElementById("koo");
ele.addEventListener('click',function(){
var src = (ele.getAttribute('src') == "logo.png")?"logo1.png":"logo.png";
ele.setAttribute('src',src);
})

<div class="img fadeIn" >
      <img src="logo.png" height="90px" width="320px" id="koo" />
</div>

JavaScript：onclick无法处理图片

3 个答案: