移动端 touchend事件

Question

            <script>
            var wechat =  document.getElementsByClassName('wechat');
            var code = document.getElementById('code')
            wechat.addEventListener('touchend',function(){
            code.style.display = 'block';
            })
            </script>

            <a href="" class="wechat">官方微信
                       <i style="display: none" id="code"></i>
            </a>

这么写有什么错误么？每次都跳转到本页，并没有实现要显示的结果

Answer 1

你这段js报错了，var wechat = document.getElementsByClassName('wechat');这个取到的是nodelist，要遍历出里面节点才能调用addEventListener，还有链接最好这样阻止下默认行为<a href="javascript:;"></a>

Answer 2

 var wechat =  document.getElementsByClassName('wechat');

取到的是一个数组，所以下一步 addEventListener回报错的，如果页面上只有一个 wechat 类，那么可以这样

 var wechat =  document.getElementsByClassName('wechat')[0];

Answer 3

<a href="" class="wechat">官方微信
<i style="display: none" id="code">2222</i>
</a>

<script>
var wechat = document.getElementsByClassName('wechat')[0];
var code = document.getElementById('code')
wechat.addEventListener('touchend',function(e){
code.style.display = 'block';
event.preventDefault();
})
</script>

将js代码放在后面，否则后报错，或用window.onload;还要用preventDefault阻止默认事件

Answer 4

安卓缓存很严重啊，真心伤不起啊，要测试一下伤了我好多时间