今天我们来学习一下如何使用 jQuery 编写一个点击按钮复制内容的功能。
首先我们需要在 HTML 页面中添加一个按钮和要被复制的内容:
<button id="copy-btn">复制</button> <p id="copy-content">这里是要被复制的内容</p>
然后,我们使用 jQuery 监听按钮的点击事件,当按钮被点击时,获取要被复制的内容,并将其复制到剪切板中:
$('button#copy-btn').click(function() { var copyContent = $('p#copy-content').text(); navigator.clipboard.writeText(copyContent) .then(function() { console.log('内容已复制到剪切板'); }) .catch(function(error) { console.error('复制失败:', error); }); });
以上代码中的 navigator.clipboard.writeText()
是 HTML5 引入的 API,它可以将指定文本复制到剪切板中。
完成了以上步骤后,当我们点击「复制」按钮时,被复制的内容就会被保存到剪切板中了。