clipboard.js在彈出框中沒法複製的問題

前幾天發現了個bug，在jquery-ui的彈出框(dialog)中，使用clipboard.js實現的複製功能，居然不會生效，後面查了下相關資料，發現不止jquery-ui的dialog不行，其餘的模態框，例如bootstrap的，也是同樣不會生效的。緣由就是彈出框會自動focus，而複製的底層實現是要獲取選中的內容，失去焦點後就沒法獲取到了，從而致使複製失敗。

解決辦法：

1）對於 Bootstrap 模態框（Modals）中使用，或是在其餘修改焦點的類庫中使用，你會但願將得到焦點的元素設置爲 container 屬性的值（網上的解決方案）

 

new Clipboard('.btn', {
    container: document.getElementById('modal')
});

 

2）對於我使用的jquery-ui的彈出框，個人作法是直接在代碼中註釋掉dialog相關的focus處理，從而成功解決該問題