javascript - 点击更改图片

Question

我有一张桌子，我想在<td>单击它时更改其中的图像，但它必须是我之前确定的图像的 URL。

我输入到页面链接的图像 URL（例如通过单击 img）

index.html?type=dog

然后脚本将从链接中读取变量。我将为脚本创建变量。

type = httpGetVars["type"]

现在，当我单击 cat 的 img 在哪里时，脚本应该将cat .png 替换为dog .png，我以这种方式进行了尝试。

<img src="cat.png" onClick="document.write("<img src=\""+ type + ".png\">);

score 1 · Accepted Answer

<img id="foo" src="cat.png />

给它<img>一个 id -foo例如：

document.getElementById('foo').src = type +".png";

您只需将现有的<img>src 更改为新图像。

score 1 · Accepted Answer

您可以定义img如下：

<img src="some_image_url.extension" onclick="switchImage(this)" />

然后在switchImage功能上您可以检查当前图像并更改为不同的图像：

var switchImage = function(image) {
    if(image.src == dogImage) {
        image.src = catImage;
    } else {
        image.src = dogImage;
    }
};

我制作了一个Sample Fiddle，所以你可以看到它正在运行。

2 回答 2