我一直在尝试在iOS 7上调试此问题,这让我发疯了。 我使用iDangerous Swiper( http://www.idangero.us/swiper/get-started/ )。 使用幻灯片中的可单击按钮前进到下一张幻灯片。 单击该按钮也有一个AJAX提交。 我一直在尝试使用touchstart事件来使点击在移动设备上更加可靠。 这项操作很成功,但是在iPhone 6(iOS 7)上,滑动滑块会在第一个幻灯片移动之前闪烁/调整大小。 在我测试过的所有其他浏览器上,都很好。

为了进行调试,我尝试使用setTimeout将所有触发的事件延迟几秒钟,以查看是由哪个事件引起的。 当我延迟事件时,不会发生闪烁/调整大小。

我不知道是什么原因或如何调试它。

jQuery触发器如下:

var clickHandler = ('ontouchstart' in document.documentElement ? "touchstart" : "click");

// make click more reliable on mobile

$(".swiper-slide fieldset.rating > label").bind(clickHandler, function(e) {

  setTimeout(function() {

   $(this).prev('input').click()
            .siblings('input').attr('checked',false)
            .end()
            .attr('checked', true);
    return false;
  }, 0); // end timeout
});


// Advance on click
//$('.swiper-slide input:radio[name^="number"]:not(.other_text)').on('click', function(e){
$('.swiper-slide input:radio[name^="number"],a.other_done').on('click', function(e){
  //$(this).next('label').html('<i class="ss-icon1 i-smile1satsum-survey"></i>');
  setTimeout(function () {
    //alert('about to trigger move');
    mySwiper.swipeNext();
  }, 200);

});

$(document).on('change', 'fieldset.rating', function (event) {
setTimeout(function () {
    //alert('about to post data');
    console.log('posting data');
    val = $(this).children('input:checked').val();
    name  = $(this).children('input:checked').attr('name');
    base_name  = name.split("[data]")[0];
    id_name = base_name + "[id]";
    id = $('input[name="' + id_name + '"]').val();

if (id > 0) {
   json_string = "{ \"" + name + "\": \"" + val + "\", \"" + id_name + "\": \"" + id + "\" }";
} else {
   json_string = "{ \"" + name + "\": \"" + val + "\" }";
};
    json_object = JSON.parse(json_string);
url = $(location).attr('href');
number_url = url.split("/play")[0];

// Change thankyou text
if (base_name == "number[recom]") {
       if (val == 5) {
          $('.custom_thankyou').removeClass("ty_active");
          $('#custom_thankyou_p').addClass("ty_active");
   } else if (val == 4) {
          $('.custom_thankyou').removeClass("ty_active");
          $('#custom_thankyou_n').addClass("ty_active");
       } else if (val < 4) {
          $('.custom_thankyou').removeClass("ty_active");
          $('#custom_thankyou_d').addClass("ty_active");
       }
}



$.ajax({
type: "PUT",
url: number_url,
dataType: "json",
data: json_object
//})
//.done(function( msg ) {
//alert( "Data Saved: " + msg );
    });

  },400); // end settimeout
});

我也尝试过“ cursor:pointer”修复,但是没有运气。 有人请给我一些想法!

  ask by andyleesuk translate from so

本文未有回复,本站智能推荐:

1回复

延迟点击事件

每当我使用on(click)事件时,仅在访问另一个元素时才注册该点击。 $(".extensions").hide(); $('.outputs').on("touchstart click", function(e) { var analogueOutputsVar = $("#AOU
2回复

jQuery事件click和touchstart

我想知道事件点击和touchstart之间的差异? 我目前所知道的是touchstart更适合触摸屏,但点击同时适用于触摸操作和鼠标点击。 我有点困惑,要验证这两个,这些都会导致任何情况延迟吗?
3回复

如何在iOS设备上用touchstart替换click

目的 单击时关闭锚标记的父div。 在下面的代码中,我想在用户单击锚标记close_performance_tt时隐藏div performance_tt 。 问题 花了几个小时后,无法让它在iOS设备上运行。 在其他一切工作正常,甚至是BlackBerry 10设备。
1回复

jQuery:识别出第一个事件后,停止触发第二个绑定事件

在jQuery中,您可以将两个事件绑定到一个jQuery对象。 启动第一个事件后,如何停止触发第二个事件? 如果单击我的元素,touchstart将立即触发。 但是,如果我将手指按住该元素,则将触发单击。 我只希望touchstart触发然后停止。 问题是它连续两次运行我的函数。
2回复

Touchstart单击事件不适用于iPhone/iPade

我编写了一个事件来通过 jQuery 打开新的浏览器选项卡( window.open ),如下所示: 此脚本适用于 windows、mac 和 iPad,但问题出现在 iPhone 上。 iPhone(版本:5、6 和 7)不会触发该事件。 我的错误是什么? 您的任何建议将不胜感激。
36回复

如何绑定“touchstart”和“click”事件但不响应两者?

我正在开发一个必须在各种设备上运行的移动网站。 目前让我头疼的是黑莓。 我们需要同时支持键盘点击和触摸事件。 理想情况下,我只使用: 但我们遇到的问题是,其中一些黑莓设备从触摸到触发点击之间有一个非常烦人的延迟。 补救方法是改用 touchstart: 但是我如何绑定两个事件,但只触发一个? 我仍然
1回复

Ionic4-平板电脑上的点击与触摸启动(点击/移动配置问题)

我们开发了一个安装在安卓平板电脑上的 POS(销售点)中的 Ionic 4 应用程序。 问题是, <ion-button (click)="doSomething">事件通常无法识别,因为用户站在平板电脑前,平板电脑非常低并且没有进行干净的点击,而是非常小的水平移动ionic 似乎识别为
1回复

如何区分InternetExplorer10/WindowsPhone8中的单击和触摸事件

我正在开发一个带有悬停导航的项目。 由于启用触摸的设备的性质,它们实际上不支持悬停。 对于iOS和Android,我设法禁用所有悬停效果并通过“touchstart”事件模拟它们,该事件设置了正确的css属性。 这就像一个魅力。 如果它是“touchstart”事件,则它是移动设备,否