javascript - 遍历img取当前点击img属性-tutorial php-php.cn

javascript - 遍历img取当前点击img属性

WBOY

Lepaskan： 2016-09-12 17:44:46

asal

1257 orang telah melayarinya

大家好，第一次提问有点紧张，本人小白，望与大家共同进步。问题是这样的，我遍历出来一组img，想要取到当前点击img的下标，我在img上加了一个num属性用来获取该元素的key，我应该怎么获取当前img的num呢？

<code>{foreach from=$answers item=item key=key }
<img  src="%7B%24item.img%7D" num="{$key}" onclick="selectImg(this)" class="funny-img"   style="max-width:90%" alt="javascript - 遍历img取当前点击img属性" >     
{/foreach}

这是遍历的img</code>

Salin selepas log masuk

javascript - 遍历img取当前点击img属性

<code>
//打印当前元素
function selectImg(a){

    console.log(a)

}

</code>

Salin selepas log masuk

javascript - 遍历img取当前点击img属性

我再console.log(this.num)是undefined,各种方法都用过，我现在已经不知道怎么获取了，求大神指导指导。

回复内容：

<code>{foreach from=$answers item=item key=key }
<img  src="%7B%24item.img%7D" num="{$key}" onclick="selectImg(this)" class="funny-img"   style="max-width:90%" alt="javascript - 遍历img取当前点击img属性" >     
{/foreach}

这是遍历的img</code>

Salin selepas log masuk

javascript - 遍历img取当前点击img属性

<code>
//打印当前元素
function selectImg(a){

    console.log(a)

}

</code>

Salin selepas log masuk

javascript - 遍历img取当前点击img属性

我再console.log(this.num)是undefined,各种方法都用过，我现在已经不知道怎么获取了，求大神指导指导。

<code><div id="wrap">
    <img src="image/1.jpg" alt="" num="1">
    <img src="image/2.jpg" alt="" num="2">
    <img src="image/3.jpg" alt="" num="3">
    <img src="image/4.jpg" alt="" num="4">
</div>
<script type="text/javascript">
    var wrap=document.getElementById("wrap");

    var imgs=wrap.getElementsByTagName('img');
    console.log(imgs.length);
    for(var i in imgs){
        imgs[i].index=i;
        imgs[i].onclick=function(){
            alert(this.getAttribute('num'));
            console.log(this.index);
        }
    }
</script></code>

Salin selepas log masuk

this.getAttribute("num");
试试看这个

原理不懂，直接用jq给img标签绑定一个点击事件，获取this就是你点击的img，想获取啥就用this.getAttribute("属性");咯