首页 > 手机 webapp中jquery动态绑定的click点击事件,安卓机可以实现,苹果系统实现不了

手机 webapp中jquery动态绑定的click点击事件,安卓机可以实现,苹果系统实现不了

手机 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就可以点击了,原理未知


貌似,苹果应该用touch


talk is cheap,show us the code

【热门文章】
【热门文章】