javascript - 检测移动设备并更改 HTML

Question

我正在使用此代码启动一个弹出表单，供人们与我们联系

<a id="pinfo" class="ajax pullup cboxElement" href="#contact-form">Enquiries</a>

但是，此弹出表单在移动浏览器上表现不佳。

我想知道是否可以使用一些 javascript 代码来检测移动浏览器并指向电子邮件地址链接href而不是弹出表单。

Answer 1

如果你想要一些简单的东西，这样的解决方案就可以了。

页面加载完成后，它将检查屏幕的宽度。

如果它检测到小屏幕，它将用电子邮件链接替换 ​​HREF

$(document).ready(function(){
    if ( screen.width < 800 ) {
       $('#pinfo').attr('href','mailto:email@address.com');
    };
});

另一种方法是检测手持设备而不是屏幕宽度，如下所示：

$(document).ready(function(){

if(     /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
       $('#pinfo').attr('href','mailto:email@address.com');
  };
  });

根据您的目标，这些解决方案之一应该满足您的需求。

祝你好运！