3

当图像的 onclick 事件被触发时，我需要获取图像源。

我尝试使用 document.getElementById("example").src; ，但浏览器上的控制台说

未捕获的类型错误：无法读取 null 的属性“src”

<html>
<head>
<script type="text/javascript">
function changeIt()
{
var name = document.getElementById("myimage").src;
alert(name);
}
</script>
</head>
<body>
<img onclick="changeIt()" src='em1.gif' name='example' border='0' />
<img onclick="changeIt()" src='em2.gif' name='example' border='0' />
<img onclick="changeIt()" src='em3.gif' name='example' border='0' />
<img onclick="changeIt()" src='em4.gif' name='example' border='0' />
<img onclick="changeIt()" src='em5.gif' name='example' border='0' />
</body>
</html>

更新部分。

实际来源是，在 AJAX 响应中，我将从文件夹中获取图像路径，为此我需要动态创建图像并将它们添加到 div 中。

这是实际代码

outputdata.forEach(function (element) {
                   content = $("<div><a href='something'><img onclick='changeIt()' src='" + element + "'   /></a></div>");
                   content.addClass('content');
                   container.append(content);
                   $("#fp_thumbScroller").append(container);
                });
            }

所以我没有创建 ID，认为不同的图像使用相同的 ID 是不合适的。

4

4 回答 4

15

html:

<img onclick="changeIt(this.src)" src='em1.gif' name='example' border='0' />

js：

function changeIt(_src){
    alert(_src);
}​
于 2012-04-22T18:50:19.940 回答
7

我会将实际元素引用（this）作为参数传递，以便您可以更改图像源或您想要更改的任何内容。

HTML：

<img onclick="changeIt(this)" src='em3.gif' name='example' border='0' />

Javascript（确保它在该区域）：

function changeIt(img)
{
    var name = img.src;
    alert(name);
}

这是一个小提琴。

于 2012-04-22T18:53:42.280 回答
1

您的 html 中是否有任何 id 为“myimage”的 img 标签？在引用之前，您必须确保有一个 id 为“myimage”的 img 元素！

于 2012-04-22T18:53:07.160 回答
0

那是因为您的所有图像都没有 ID：

<img id="myImage" onclick="changeIt()" src='em1.gif' name='example' border='0' />
于 2012-04-22T18:46:10.790 回答