javascript
html复制文字兼容手机,JavaScript+Html5实现按钮复制文字到剪切板功能(手机网页兼容)...
新學習JavaScript,就碰到這么一個需求,幾乎網上的方法都試過了。寫出了總結下
使用的方法:clipboard
插件下載地址:https://github.com/zenorocha/clipboard.js/tree/master
引入插件:目錄\clipboard.js-master\dist\clipboard.min.js
目錄中有各種demo,分別實現了固定的文字復制,input的復制等等,可以看下找找思路;
下邊來記錄下使用的方式:
一:引入插件:
二:給標簽添加屬性:data-clipboard-text
Copy
三:定義script :實現復制功能---(寫的內部的script,外部的總是報錯,找不到類,新手不大懂,以后再補充)
var clipboard = new Clipboard('btn');
clipboard.on('success', function(e) {
e.clearSelection();
//復制成功
});
clipboard.on('error', function(e) {
//復制失敗
});
補充:new Clipboard()----參數為id class都可以,跟css定義一樣 id 或者.class
四:自定義復制的內容;
new Clipboard('.btn', {
target: function(trigger) {
return trigger.nextElementSibling;
}
});
通過return返回想復制的內容,
五:列表頁復制每條列表內容
可以給每個item自定義屬性data-clipboard-text即可
div.setAttribute("data-clipboard-text","asdf");
補充:電腦瀏覽器幾乎都可以支持,手機上安卓可以,蘋果有點問題,需要把標簽設置成button
以上所述是小編給大家介紹的JavaScript+Html5實現按鈕復制文字到剪切板功能(手機網頁兼容),希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對網站的支持!
總結
以上是生活随笔為你收集整理的html复制文字兼容手机,JavaScript+Html5实现按钮复制文字到剪切板功能(手机网页兼容)...的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 用于大型的科学计算的计算机,科学计算器广
- 下一篇: 9.JSP运行原理与JSP页面的基本结构