使用 JQuery 和 Clipboard.js 实现按钮复制当前 URL
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>使用浏览器打开</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="aplus-touch" content="1">
<link rel="stylesheet" href="index.css">
<style>
body {
background-image: url('bg.jpg');
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
position: relative;
z-index: -1;
}
</style>
</head>
<body>
<div class="top-bar-guidance">
<p>点击右上角<img src="//gw.alicdn.com/tfs/TB1xwiUNpXXXXaIXXXXXXXXXXXX-55-55.png" class="icon-safari"> <span id="openm">Safari打开</span></p>
<p>可以继续浏览本站哦~</p>
</div>
<div id="browser">
<p id="copy-msg"></p>
</div>
<div class="app-download-tip">
<span class="guidance-desc">点击上方图标或复制本站网址自行打开</span>
</div>
<div style="text-align:center;">
<p class="guidance-desc" style="color:white; font-weight:bold;">请勿在微信QQ聊天中打开本站</p>
</div>
<a href="#" class="app-download-btn" data-clipboard-text='<?= $siteurl ?>'>点此复制本站网址</a>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
<script src="/u/layer.js"></script>
<script>
new ClipboardJS('.app-download-btn', {
text: function() {
$('#copy-msg').text('已成功复制到剪贴板').css({'color':'white', 'font-weight':'bold'});
return '<?= $siteurl ?>';
}
});
</script>
<script>
var isQQ = navigator.userAgent.indexOf('QQ/') !== -1;
var isWechat = navigator.userAgent.indexOf('MicroMessenger') !== -1;
var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
<pre><code>if (isQQ || isWechat) {
alert('请使用浏览器打开');
} else if (isMobile) {
window.location.href = 'opan.html';
} else {
window.location.href = 'opan.html';
}
</script>
</code></pre>
</body>
</html>
代码已经实现了使用JQ和Clipboard.js库实现了复制按钮功能，无需修改。
原文地址: https://www.cveoy.top/t/topic/jqkE 著作权归作者所有。请勿转载和采集!