Question

在下面的代码中，我尝试使用id =＆＃34; chrome＆＃34;来更改图像的图像。使用JavaScript，但它似乎没有做任何事情。我做错了什么，我该如何解决。先谢谢你。

第一张图片的ID为chrome，点击后我尝试更改图片。

这是我使用的js。

function changeImage() {

    if (document.getElementById("chrome").src == "https://upload.wikimedia.org/wikipedia/commons/8/87/Google_Chrome_icon_%282011%29.png") 
    {
        document.getElementById("chrome").src = "https://www.centerpointe.com/v2/wp-content/uploads/2014/01/red-x.png";
    }
    else 
    {
        document.getElementById("chrome").src = "https://upload.wikimedia.org/wikipedia/commons/8/87/Google_Chrome_icon_%282011%29.png";
    }
}

基本上，对于具有chrome图标的第一行，我想在点击时将其更改为x图像。

Answer 1

将<img onclick()="changeImage()">更改为<img onclick="changeImage()">

Answer 2

首先，将<img onclick()="changeImage()"更改为<img onclick="changeImage()"。如果您想为多个用户执行此操作，那么这并不能解决您的问题，因为每个Chrome图像都需要它自己的ID才能使该函数处理多个徽标。

Answer 3

你有一个错字。定义内联onclick时，您已撰写：

<div onclick()="changeImage()"></div>

应该是：

<div onclick="changeImage()"></div>

请参阅以下代码段：

＆＃13;

function changeImage() {

        if (document.getElementById("chrome").src == "https://upload.wikimedia.org/wikipedia/commons/8/87/Google_Chrome_icon_%282011%29.png") 
        {
            document.getElementById("chrome").src = "https://www.centerpointe.com/v2/wp-content/uploads/2014/01/red-x.png";
        }
        else 
        {
            document.getElementById("chrome").src = "https://upload.wikimedia.org/wikipedia/commons/8/87/Google_Chrome_icon_%282011%29.png";
        }
    }

＆＃13;

img {
			height: 25px;
      padding-right: 4px;
		}
		li {
			margin: 4px;
      clear: both;
		}
		li:nth-child(odd) { 
			background: #f0f0f5; 
		}

＆＃13;

<ul class="list-unstyled">
				<li>Username<span class="pull-right">
          <img onclick="changeImage()" id ="chrome" src="https://upload.wikimedia.org/wikipedia/commons/8/87/Google_Chrome_icon_%282011%29.png"></span><span class="pull-right"><img id="firefox" src="http://pngimg.com/uploads/firefox/firefox_PNG16.png"></span><span class="pull-right">
          <img id="ie" src="https://ma.ttias.be/wp-content/uploads/2015/07/internet-explorer-logo.png"></span></li>
				
			</ul>

＆＃13;

Answer 4

而不是onclick（）=“changeImage（）”; ....使用 onclick =“changeImage（）” .....去除“（）” onclick功能中的括号

Answer 5

HTML代码中存在语法错误。 onclick不是一个函数，它是一个HTML属性，所以你不要通过向它添加括号来将其称为函数。

您只能使用onclick属性的值，即JavaScript语法。

正确的代码是：

<img onclick="changeImage()">

以下是您的代码笔的工作版本：https://codepen.io/pahund/pen/XgWVQx

onclick函数不执行更改图像

5 个答案: