忽略取消触摸启动的尝试：fastclick 警告答案

【问题标题】：Ignored attempt to cancel a touchstart : fastclick warning忽略取消触摸启动的尝试：fastclick 警告
【发布时间】：2017-01-04 06:35:12
【问题描述】：

我有第一个弹出窗口，另一个弹出窗口来选择几个字段。为了显示第二个弹出窗口，这是我正在尝试的代码：

$("#select1").click(function(e) {
  e.stopPropagation();
  //$('#sellerModal').hide();
  var tmplData = {
    string:['Ready','2-3 Days','4-5 Days','1 Week','10+ Days']
  };
  $("#countTypePopupTemplate").tmpl(tmplData).appendTo(".maindiv");
  that.closePopup();
  $("#count_div").each(function() {
    $("#count_div").click(function(evt) {
      evt.stopPropagation();
      $("#select1").text($(this).text());
      $("#myCounttype").remove();
    });
  });
});

这是 HTML 模板：

<script id="countTypePopupTemplate" type="text/x-jquery-tmpl">
  <div id="myCounttype" class="popup1 layer-2">
    <div class="popup5">
      {{each string}}
      <div id="count_div" class="popup4 bottom-border">${$value}</div>
      {{/each}}
    </div>
  </div>
</script>

我收到警告：

Ignored attempt to cancel a touchstart event with cancelable=false, for example, because scrolling is in progress and cannot be interrupted. fastclick.js

在这里，我无法在第二个弹出窗口中单击 5 个元素中的 4 个。只有前 1 个是可点击的。第二个弹出窗口的快照。

我阅读了所有讨论该主题的博客。但是没有任何解决方案适合我。看起来有一些角落案例。

【问题讨论】：

尝试使用jquerymobile.com将click事件更改为touchstart
我也试过了...没用...感谢您的回复
你的each函数只是指向id的按钮，这导致你不能点击其他按钮，尝试使用class和@987654332 @在each。例如$(".pop_btns").each(function(){$(this).click(function(){ alert($(this).text()); })});
如果您使用手机进行调试，请尝试在您的计算机上使用 chrome (android) 或 safari (iOS)。铬：developers.google.com/web/tools/chrome-devtools/… Safari：moduscreate.com/enable-remote-web-inspector-in-ios-6
这对你有用吗？

标签： javascript jquery html cordova fastclick.js

【解决方案1】：

尝试在$("#count_div").each(function() { $("#count_div").click(function(evt) { 之前使用一些父选择器赞这个$(".parent_class #count_div").each(function() { $(".parent_class #count_div").click(function(evt) {

这将解决运行 each() 为 "#count_div" 的 1 次问题。

所以实际的问题是 each() 只运行了 1 次，这就是为什么你的第一个元素是 Ready 点击事件正在工作，而不是其他元素。

【讨论】：

看起来和我做的一样，而且效果很好……谢谢你的解释，它真的很好理解。

【解决方案2】：

您的每个函数都指向 id，这使您无法单击其他按钮。您应该使用类来识别按钮。

$("#select1").click(function(e) {
  e.stopPropagation();
  //$('#sellerModal').hide();
  var tmplData = {
    string:['Ready','2-3 Days','4-5 Days','1 Week','10+ Days']
  };
  $("#countTypePopupTemplate").tmpl(tmplData).appendTo(".maindiv");
  that.closePopup();
  $(".pop_btns").each(function() {
    $(this).click(function(evt) {
      evt.stopPropagation();
      $("#select1").text($(this).text());
      $("#myCounttype").remove();
    });
  });
});

HTML 模板：

<script id="countTypePopupTemplate" type="text/x-jquery-tmpl">
  <div id="myCounttype" class="popup1 layer-2">
    <div class="popup5">
      {{each string}}
      <div id="count_div" class="popup4 bottom-border pop_btns">${$value}</div>
      {{/each}}
    </div>
  </div>
</script>

【讨论】：