忽略尝试取消触摸开始：快速点击警告

Question

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

$("#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

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

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

Answer 1

您的每个功能都指向id，这使您无法单击其他按钮。你应该用class来识别按钮。

$("#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>

Answer 2

在$("#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"运行。

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