如何在 html 中的同一个 onclick 事件属性上调用两个不同的 JavaScript 函数，一个用于桌面版，一个用于移动版？

Question

我有一个针对桌面版和移动版的响应式 HTML 页面。而我有两个功能，一个是针对桌面版的，一个是针对移动版的。这两个函数都在 div 中的同一个 onclick 事件属性上。我希望根据设备的宽度一次执行一个功能，即，如果屏幕宽度大于 425px，则应执行桌面功能，如果屏幕宽度为 425px 或更小，则执行该功能应执行移动版本。在 Whosebug 上找到了不同的答案，例如 window.matchMedia() 等，但它对我不起作用。

Answer 1

尝试 window.innerWidth <= 425 检测手机。

你可以用这个和全局 getter 做一些有趣的事情：

Object.defineProperty(window, 'mobile', {
  get() {
    return window.innerWidth <= 425;
  }
})

function SomeFunction() {
  if (mobile) {
    alert('im on mobile!')
  } else {
    alert('on a tablet, laptop, or desktop!')
  }
}

如何在 html 中的同一个 onclick 事件属性上调用两个不同的 JavaScript 函数，一个用于桌面版，一个用于移动版？

How to call two different JavaScript functions, one for desktop version and one for mobile version on a same onclick event attribute in html?

html

javascript

onclick