如何在单击该图像的onclick事件上获取图像源路径

use*_*847 2 javascript

当触发图像的onclick事件时,我需要获取Image源.

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

未捕获的TypeError:无法读取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>
Run Code Online (Sandbox Code Playgroud)

更新部分.

实际的来源是,在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);
                });
            }
Run Code Online (Sandbox Code Playgroud)

所以我没有创建ID,因为不适合为不同的图像使用相同的ID.

mgr*_*aph 12

HTML:

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

JS:

function changeIt(_src){
    alert(_src);
}?
Run Code Online (Sandbox Code Playgroud)


TJ.*_*TJ. 6

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

HTML:

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

Javascript(确保它在该区域):

function changeIt(img)
{
    var name = img.src;
    alert(name);
}
Run Code Online (Sandbox Code Playgroud)

这是一个小提琴.