移动端不同按钮触觉反馈强度怎么设置？iOS完全没反应

闲人瑞琴提问于 2026-02-03 18:04:30 阅读 37

交互

大家好，我在给电商App的加减按钮做触觉反馈时遇到问题。希望点击加号震动强一点，减号轻一点，但用Vibrate API在iOS上完全没反应…

我试过这样写代码：navigator.vibrate(50) 给加号，navigator.vibrate(20) 给减号。安卓效果明显，但iOS点击时毫无反馈。难道iOS不支持这种毫秒数区分强度的方式？

后来查文档发现iOS好像要用不同的pattern，于是尝试写成这样：


if ('vibrate' in navigator) {
  addButton.addEventListener('click', () => navigator.vibrate([0, 50])); // 加号
  subButton.addEventListener('click', () => navigator.vibrate([0, 20])); // 减号
}

但测试时两个按钮震动时长居然一样，强度也没区别，这是哪里出问题了？难道pattern数组的写法不对？

我来解答赞 5 收藏

反馈

2 条解答

慕容杏花 Lv1

iOS 的震动反馈确实和安卓不一样，它不支持通过毫秒数直接控制强度，而是依赖系统预定义的震动模式。你用的 navigator.vibrate 在 iOS 上基本是无效的，因为苹果有自己的震动 API，叫 HapticFeedback。

代码放这了：

if (window.navigator.vibrate) {

  // 安卓处理

  addButton.addEventListener('click', () => navigator.vibrate(50));

  subButton.addEventListener('click', () => navigator.vibrate(20));

} else if (window.UIImpactFeedbackGenerator) {

  // iOS 处理

  const strongFeedback = new window.UIImpactFeedbackGenerator(2); // 强震动

  const lightFeedback = new window.UIImpactFeedbackGenerator(1); // 轻震动



  addButton.addEventListener('click', () => {

    strongFeedback.impactOccurred();

  });



  subButton.addEventListener('click', () => {

    lightFeedback.impactOccurred();

  });

}

解释一下：iOS 的 UIImpactFeedbackGenerator 有三个强度级别，分别是 0（轻）、1（中）、2（重）。你只需要根据按钮选择不同的强度就行。上面代码里加号用了强震动（2），减号用了轻震动（1）。

注意，这个 API 只能在真机上测试，模拟器是没效果的。安卓还是用原来的 vibrate，所以判断一下环境分开处理就行。

就这样，应该能解决你的问题。

2026-02-18 08:02

梓怡 Lv1

iOS的Vibrate API确实不支持通过毫秒数调节强度，用pattern数组是对的，但iOS上只有特定模式才会触发不同强度震动。试试下面这个写法：

addButton.addEventListener('click', () => navigator.vibrate([0, 50, 0, 100])); // 强震动

subButton.addEventListener('click', () => navigator.vibrate([0, 20])); // 轻震动

第一个按钮用了强震动模式（50ms短震+100ms长震），第二个是普通轻震。iOS对震动模式有限制，不能随意调节强度，只能通过pattern数组的组合来达到不同效果。

2026-02-03 18:05