WhatsApp分享按钮在网站上。简单的方法来检测WhatsApp是否存在? [英] WhatsApp share button on website. Easy way to detect if WhatsApp exists?
问题描述
我在我的网站上添加WhatsApp共享按钮,我想隐藏此按钮时,WhatsApp功能不存在(不支持)在用户设备上。有一个简单的方法吗?
I'm adding WhatsApp share button on my website and I would like to hide this button when WhatsApp functionality does not exists (is not supported) on user device. Is there an easy way? Or any way?
我发现 http:// whatsapp分享。 com ,但它对我有一些缺点。
- 没有自定义按钮/图标支持
- 看起来像只检测Android和IO(Windows Phone?)
- 难以维护更大的项目
I found http://whatsapp-sharing.com, but it has some disadvantages for me. - no custom buttons/icons supported - looks like it's detecting only Android and IOs (what about Windows Phone?) - hard to maintain on bigger project
我正在搜索一些JS / jQuery或者CSSonly(mediaqueries?)解决方案,但没有成功现在。
任何建议都会有帮助,谢谢。
I'm searching for some JS/jQuery or maybe CSSonly (mediaqueries?) solution, but without success for now. Any advice would be helpfull, thanks.
推荐答案
DEMO
尝试此
$(document).ready(function() {
var isMobile = {
Android: function() {
return navigator.userAgent.match(/Android/i);
},
BlackBerry: function() {
return navigator.userAgent.match(/BlackBerry/i);
},
iOS: function() {
return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
Opera: function() {
return navigator.userAgent.match(/Opera Mini/i);
},
Windows: function() {
return navigator.userAgent.match(/IEMobile/i);
},
any: function() {
return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
}
};
if( isMobile.any() ) {
//hide the share button
}
$(document).on("click", '.whatsapp', function() {
if( isMobile.any() ) {
var text = $(this).attr("data-text");
var url = $(this).attr("data-link");
var message = encodeURIComponent(text) + " - " + encodeURIComponent(url);
var whatsapp_url = "whatsapp://send?text=" + message;
window.location.href = whatsapp_url;
} else {
alert("Please share this article in mobile device");
}
});
});
SOURCE
这篇关于WhatsApp分享按钮在网站上。简单的方法来检测WhatsApp是否存在?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!