点击通过js遍历出来的列表,跳转页面。点击事件委托在document上,
像这样: $(document).on("click",".nav",function(){ })
在web和Android上度没问题,能够正常跳转。但是在ios上点击没有任何反应。原因是:ios上事件委托不能绑定在document和ios上,应该绑定在它的其它父级元素上
$.each(dataall,function(i,item){ str += ‘<div class="nav shadow-black" data-str="‘ +item.data_str +‘"><div class="nav-item"><img src="‘ +item.myheadimgurl +‘" /><div class="ellipsis">‘ +item.myusername +‘</div></div><div class="nav-item alike"><div>VS</div><div>‘ +item.addtime +‘</div></div><div class="nav-item"><img src="‘ +item.compareheadimgurl +‘" /><div class="ellipsis">‘ +item.compareusername +‘</div></div></div>‘; }); $("#shareContent").html(str);
//ios点击没反应,未触发事件 $(document).on(‘click‘,‘.nav‘,function(){ var data_str = $(this).data(‘str‘); window.location.href = ‘http://test.epoque.cn/user/footcompare/compare_foot?data_str=‘+ data_str; }) //将事件委托在其他元素上,ios点击可跳转 $(‘#shareContent‘).on(‘click‘,‘.nav‘,function(){ var data_str = $(this).data(‘str‘); window.location.href = ‘http://test.epoque.cn/user/footcompare/compare_foot?data_str=‘+ data_str; })
另外一个问题:经常在ios上一个按钮点不了,像这样<span>按钮</span>,原因是语义化的问题,可以用a标签或者button,解决办法:加样式:cursor:pointer。