如何绑定touchstart和click事件，但不响应这两个事件

要绑定touchstart和click事件，但不响应这两个事件，可以通过以下步骤：

1. 安装fastclick库，可以通过npm i fastclick命令进行安装；

2. 在需要绑定touchstart和click事件的页面或组件中引入fastclick：

<script src="path/to/fastclick.js"></script>

或者在组件中使用import引入：

import FastClick from 'fastclick';

1. 在页面加载完成后对document进行绑定：

if ('addEventListener' in document) {
    document.addEventListener('DOMContentLoaded', function() {
        FastClick.attach(document.body);
    }, false);
}

这样，touchstart和click事件就会被fastclick监听并阻止默认行为，从而部分的解决了移动端点击延迟的问题。

如果想更加彻底的禁止touchstart和click事件的默认行为，可以在将fastclick库引入后，在相应的元素上进行样式覆盖，即：

/* 禁用默认 tap/highlighted 状态 */
a, button, input, select, textarea {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    tap-highlight-color: rgba(0,0,0,0);
    tap-highlight-color: transparent;
}
/* 禁用 tap 内容滚动 */
* {
    touch-action: manipulation;
}

这样，就可以完全禁止touchstart和click事件的默认行为，确保没有任何响应。

示例一：

在以下代码中绑定touchstart和click事件：

const button = document.querySelector('.button');
button.addEventListener('touchstart', function() {
    console.log('touchstart');
});
button.addEventListener('click', function() {
    console.log('click');
});

使用fastclick处理：

if ('addEventListener' in document) {
    document.addEventListener('DOMContentLoaded', function() {
        FastClick.attach(document.body);
    }, false);
}

示例二：

在以下代码中绑定touchstart事件：

const button = document.querySelector('.button');
button.addEventListener('touchstart', function() {
    console.log('touchstart');
});

使用样式禁止默认行为：

/* 禁用默认 tap/highlighted 状态 */
.button {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    tap-highlight-color: rgba(0,0,0,0);
    tap-highlight-color: transparent;
}
/* 禁用 tap 内容滚动 */
* {
    touch-action: manipulation;
}