点击和touch 事件之间的jQuery冲突解决方法

$("#main").on("touchstart, touchend", function(e) {
  e.preventDefault();

  console.log("touch zone>");
})

$(document).on("click", "#main a", function(e) {
  e.preventDefault();

  console.log("Button click");
});

#main {
  width: 40vh;
  height: 90vh;
  overflow: hidden auto;
  background: Gray;
}

<section id="main">
  <h1>Title demo <a href="#">Link</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>

  <h1>Title demo <a href="#">Link</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>

  <h1>Title demo <a href="#">Link</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>

  <h1>Title demo <a href="#">Link</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>

  <h1>Title demo <a href="#">Link</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>

  <h1>Title demo <a href="#">Link</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
</section>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>

$("#main").on("touchstart, touchend", () => {
  console.log("touch zone");
})

$(document).on("click", "#main button", () => {
  console.log("Button click");
});

.main {
  width: 40vh;
  height: 90vh;
  overflow: hidden auto;
  background: Gray;
}

<section id="main" class="main">
  <h1>Title demo <button>Action</button></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
  <h1>Title demo <button>Action</button></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
  <h1>Title demo <button>Action</button></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
  <h1>Title demo <button>Action</button></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
  <h1>Title demo <button>Action</button></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
</section>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>

Jquery相关问答推荐

这是否会导致内存泄漏？

JQuery日期 Select 器未设置从jQuery中 Select 的月份起90天或3个月

JQuery：$.get 不是函数

如何使用jQuery删除父元素

在 Javascript 中启用和禁用 Div 及其元素

jQuery 与 ExtJS

在 `click` 和 `enter` 上触发事件

jQuery $.cookie 不是一个函数

$(document).on('click', '#id', function() {}) 与 $('#id').on('click', function(){})

Jquery 和 HTML FormData 返回未捕获的 TypeError：非法调用

我可以使用 jQuery 打开下拉列表吗

jQuery ajax (jsonp) 忽略超时并且不触发错误事件

Javascript 将 Markdown/Textile 转换为 HTML(理想情况下，返回 Markdown/Textile)

jQuery ajax 成功回调函数定义

Url.Action 在我的 url 中放了一个 &，我该如何解决这个问题？

jQuery vs jQuery Mobile vs jQuery UI？

jQuery：如何找到父母的特定子元素？

Select jQuery UI 自动完成后清除表单字段

如何在调用 Ajax 等异步调用时让代码等待

JavaScript 在 DOM 中移动元素