获得单击元素的ID并将其包含在纯JS的函数中？ [英] Get clicked element's ID and include it in a function with pure JS?

问题描述

$ b

HTML：

我需要根据每个不同的图标点击显示不同的输出， pre> < p onclick =expand（）id =i1> icon1< / p>
< p onclick =expand（）id =i2> icon2< / p>
< p onclick =expand（）id =i3> icon3< / p>
< div id =blocki1>< / div>
< div id =blocki2>< / div>
< div id =blocki3>< / div>


我可以用JS做这样的事吗？

  function expand（）{
 document.getElementById（block+ this.id）.style.display =block; 
} 
  

我试过了上面显示没有工作的方法，我需要到a）存储图标的ID并且b）将该ID与字符串组合。不知道这是否可能。

解决方案

 < p onclick =expand this.id）id =i1> icon1< / p> 
< p onclick =expand（this.id）id =i2> icon2< / p> 
< p onclick =expand（this.id）id =i3> icon3< / p> 
< div id =blocki1>< / div> 
< div id =blocki2>< / div> 
< div id =blocki3>< / div> 
< script> 
 function expand e）{
 document.getElementById（block+ e）.style.display =block; 
}} 
< / script> 
  

I need to display different output according to each different icon clicked without defining separate functions;

HTML:

<p onclick="expand()" id="i1">icon1</p>
<p onclick="expand()" id="i2">icon2</p>
<p onclick="expand()" id="i3">icon3</p>
<div id="blocki1"></div>
<div id="blocki2"></div>
<div id="blocki3"></div>

Can I do something like this with JS?

function expand() {
document.getElementById("block" + this.id).style.display = "block";
}

I've tried the method above which apparently didn't work, I need to a)store icon's id and b) combine the id with string. Don't sure if that's possible.

解决方案

<p onclick="expand(this.id) id="i1">icon1</p>
<p onclick="expand(this.id) id="i2">icon2</p>
<p onclick="expand(this.id) id="i3">icon3</p>
<div id="blocki1"></div>
<div id="blocki2"></div>
<div id="blocki3"></div>
<script>
function expand(e) {
document.getElementById("block" + e).style.display = "block";
}}
</script>

这篇关于获得单击元素的ID并将其包含在纯JS的函数中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！