Question

我试图在点击时获取每张图片的ID，但我似乎无法找到这样做的方法，我已设法使用第一张图片但是与所有人斗争。如果有人能在这里帮助我，那就太棒了。

提前致谢。

＆＃13;

function myFunction() {
  var tagID = document.getElementsByTagName('img')[0].id;
  document.getElementById("results").innerHTML = tagID;
}

＆＃13;

<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A1" onclick="myFunction()">
<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A2" onclick="myFunction()">
<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A3" onclick="myFunction()">

<p id="results"></p>

＆＃13;

Answer 1

您已对要使用的图像进行了硬编码。 [0]此ALWAYS使用相同的图像ID。

您需要传入您想要使用的图像，然后获取其ID。

function myFunction(img) {
  var tagID = img.id;
  document.getElementById("results").innerHTML = tagID;
}

<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A1" onclick="myFunction(this)">
<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A2" onclick="myFunction(this)">
<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A3" onclick="myFunction(this)">

<p id="results"></p>

Answer 2

您可以将event传递给您的函数并从图片中访问ID。使用event.target，您可以引用调度事件的对象。

＆＃13;

function myFunction(e){
  var imageId = e.target.id;
  document.getElementById("results").innerHTML = imageId;
}

＆＃13;

<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A1" onclick="myFunction(event)">
<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A2" onclick="myFunction(event)">
<img src="http://server2.sulmaxcp.com/Images/gridDefault.png" draggable="false" id="A3" onclick="myFunction(event)">

<p id="results"></p>

＆＃13;

从每个标签获取ID点击

2 个答案: