手机 webapp中jquery动态绑定的click点击事件,安卓机可以实现,苹果系统实现不了
<!-- Initialize Swiper -->
<script>
var swiper = new Swiper('.swiper-container', {
pagination: '.swiper-pagination',
paginationClickable: true,
autoplay:3000,
loop:true
});
</script>
<!--************************************顶导航***********************-->
<!-- 台位类型 台位类型 台位类型 台位类型 -->
<div class="swiper-container swiper-container2">
<div class="swiper-wrapper">
<volist name="type" id='vo' key="k">
<div class="swiper-slide ">{$vo}</div>
</volist>
</div>
</div>
<!--/****************************************台位*********************************/-->
<div class="bigbox_right">
<div class="left_box">剩余<span>0</span>张</div>
<div id="wrapper">
<div id="scroller">
<ul>
<!-- <li class="current_table">K01</li> -->
</ul>
</div>
</div>
</div>
<div class="table_img"><img src="{$sourceurl}/Public/Static/img/banner-bargain-share@2x.png"></div>
<div class="table_tyoe">
<div class="tab">卡座K01</div>
<div>适用于<span>6</span>人</div>
</div>
<div class="bottom_bar">
<div>
<div class="spend">最低消费:<lable>2000</lable></div>
<div class="position">位置:<lable>A区右手边2号</lable></div>
</div>
<div class="table_order_brn">立即订台</div>
<input type="hidden" value="" name="tableid">
</div>
<div class="zhezhao"></div>
<div class="dise2">
<div class="guanbi"><img id="clsid" src="{$sourceurl}/Public/Static/img/guanbi.png"></div>
<div class="di">
<div class="yuding">友情提示</div>
<div class="xingxiang"></div>
</div>
<div class="queding">
<div class="fou" id="noclick">否</div>
<div class="shi" id="okclick">是</div>
</div>
</div>
</div>
<!-- Initialize Swiper -->
<script>
var swiper = new Swiper('.swiper-container2', {
pagination: '.swiper-pagination',
paginationClickable: false,
slidesPerView: 4,
loop:false
});
// 点击台位类型切换效果
$(".swiper-container2 .swiper-slide:first-child").addClass('curren_slider');
$(document).on("click",".swiper-container2 .swiper-slide",function(){
$(".swiper-container2 .swiper-slide").removeClass("curren_slider");
$(this).addClass('curren_slider');
var type=$(this).html();
$.post(
"{:U('App/Table/searchtype')}",
{'tablename':type},
function(data){
var a=0;var str="";
$.each(data.rows,function(e,v){
a+=1;
if(e==0){
str+="<li class='current_table'>"+v.code+"</li>";
$(".table_img img").attr("src","__PUBLIC__/Uploads/"+v.tbimgurl);
$(".table_tyoe .tab").html(v.tablename+v.code);
$(".table_tyoe span").html(v.number);
$(".spend lable").html(v.paymoney);
$(".position lable").html(v.postion);
$("input[name='tableid']").val(v.tableid);
//判断是否被预定
$.post("{:U('App/Table/isorders')}",{'tableid':v.tableid},function(data){
if(data.staute==1){
$('.table_order_brn').attr('id','btno');
$('.table_order_brn').html('已被预订');
}else{
$('.table_order_brn').attr('id','btn');
$('.table_order_brn').html('立即订台');
}
});
}else{
str+="<li>"+v.code+"</li>";
}
});
$(".left_box span").html(a);//alert(a);
$("#scroller ul").html(str);
var x = $("#scroller li").innerWidth();
var n = a;<!-- alert(x+"/"+n);alert(x*n/100); -->
$("#scroller").css({width:x*n/100*2+"rem"});
myScroll.refresh();
}
);
});
</script>
<!-- 台位向左滑动效果 -->
<script type="text/javascript">
var myScroll;
function loaded () {
$.post("{:U('App/Table/searchtype')}",{'tablename':$(".swiper-container2 .curren_slider").html()},function(data){
var a=0;var str="";
$.each(data.rows,function(e,v){
a+=1;
if(e==0){
str+="<li class='current_table'>"+v.code+"</li>";
$(".table_img img").attr("src","__PUBLIC__/Uploads/"+v.tbimgurl);
$(".table_tyoe .tab").html(v.tablename+v.code);
$(".table_tyoe span").html(v.number);
$(".spend lable").html(v.paymoney);
$(".position lable").html(v.postion);
$("input[name='tableid']").val(v.tableid);
//判断是否被预定
$.post("{:U('App/Table/isorders')}",{'tableid':v.tableid},function(data){
if(data.staute==1){
$('.table_order_brn').attr('id','btno');
$('.table_order_brn').html('已被预订');
}else{
$('.table_order_brn').attr('id','btn');
$('.table_order_brn').html('立即订台');
}
});
}else{
str+="<li>"+v.code+"</li>";
}
});
$(".left_box span").html(a);
$("#scroller ul").html(str);
var x = $("#scroller li").innerWidth();
var n = a;<!-- alert(x+"/"+n);alert(x*n/100); -->
$("#scroller").css({width:x*n/100*2+"rem"});
myScroll.refresh();
});
myScroll = new IScroll('#wrapper', { eventPassthrough: true, scrollX: true, scrollY: false, preventDefault: false });
}
</script>
<!-- -->
<script type="text/javascript">
// 座位点击切换
$(document).on("click","#scroller ul li",function() {
$("#scroller ul li").removeClass("current_table");
$(this).addClass("current_table");
var code=$(this).html();
$.post(
"{:U('App/Table/searchcode')}",
{'code':code},
function(data){
$.each(data.rows,function(e,v){
$(".table_img img").attr("src","__PUBLIC__/Uploads/"+v.tbimgurl);
$(".table_tyoe .tab").html(v.tablename+v.code);
$(".table_tyoe span").html(v.number);
$(".spend lable").html(v.paymoney);
$(".position lable").html(v.postion);
$("input[name='tableid']").val(v.tableid);
//判断是否被预定
$.post("{:U('App/Table/isorders')}",{'tableid':v.tableid},function(data){
if(data.staute==1){
$('.table_order_brn').attr('id','btno');
$('.table_order_brn').html('已被预订');
}else{
$('.table_order_brn').attr('id','btn');
$('.table_order_brn').html('立即订台');
}
});
})
}
);
});
$(document).on('click',"#btn",function(){
id=$("input[name='tableid']").val();
$(".zhezhao,.dise2").show();
$(".xingxiang").html('为了给您提供更好的服务,是否选择现场经理?');
$(".shi").click(function(){
$(".zhezhao,.dise2").hide();
location.href="{:U('App/Table/tableorder')}/tableid/"+id+"/type/select";
});
$(".fou").click(function(){
$(".zhezhao,.dise2").hide();
location.href="{:U('App/Table/tableorder')}/tableid/"+id+"/type/tab";
});
});
$("#clsid").click(function(){
$(".zhezhao,.dise2").hide();
});
</script>
前不久遇到一个问题,IOS safari就是点击不了,安卓和chrome是好的,可能和你差不多情况吧,当时给要点击的元素加上(onclick="")括号内的,引号内空的,然后IOS就可以点击了,原理未知