鍍金池/ 問答/HTML5  iOS  Android  HTML/ 怎么實現(xiàn)移動端的復制粘貼以及兼容性?

怎么實現(xiàn)移動端的復制粘貼以及兼容性?

//html
<input id="inviteLink1" type="text" value="http:www.66ddcc.cn/user/invite?uid=15467789331"/>
<button class="inviteBtn1" data-clipboard-action="copy" data-clipboard-target="#inviteLink1">復制分享</button>

//js
$('.inviteBtn1').on('tap', function() {
    try {
        if(window.clipboardData.setData('Text', $('#inviteLink1').val())){
            alert('復制成功1');
        }else{
            alert('您的瀏覽器不支持,請選擇“拷貝”進行復制1');
        }
    } catch(e1) {
        try {
            var clipboard = new Clipboard('#inviteBtn1');
            clipboard.on('success', function(e) {
                e.clearSelection();
                alert('復制成功!2')
            });
            clipboard.on('error', function(e) {
                alert('您的瀏覽器不支持,請選擇“拷貝”進行復制2');
            });
        } catch(e2) {
            inviteLink1.select();
            document.execCommand('copy');
        }
    }
});

據(jù)我所知有這三種方法其他的方法不清楚了,第一種方法兼容性好像不好,第二個插件總是提示Clipboard is not define,總是沒有定義我也不太清楚,第三種在安卓下試了幾個瀏覽器沒有太大問題,但是ios下沒有效果。

有沒有能夠兼容安卓和ios的復制粘貼功能,或者第二種方法該怎么解決?
如果不直接復制到粘貼板,該怎么打開瀏覽器自帶的復制菜單,自動框選后讓用戶點擊復制。

回答
編輯回答
兮顏

之前用的clipboard一個版本不知道為什么new實例的時候回報錯,后面換了一個版本可以了。

這個插件可以解決大部分瀏覽器的復制了,這個東西可能本來就不是完全性的可能還是有些讓用戶去手動復制吧/

2017年12月10日 08:21
編輯回答
傻叼

使用相關插件實現(xiàn)簡便快捷,如果有不能實現(xiàn)的方法搜尋其他插件或為平臺不支持

2017年10月4日 17:45