通过 js 复制隐藏域的内容

  
Click button below to copy current url to clipboard with hidden input
  
  Copy

2、CSS部分

.wrapper{
  width: 100%;
  height: 100%;
  text-align: center;
  margin-top:10px;
}
.btn-copy{
  background-color: #38AFDD;
  border: transparent;
  border-bottom: 2px solid #0086B7;
  border-radius: 2px;
  padding: 10px;
  min-width: 100px;
  color: #fff;
}
.btn-copy:hover, .btn-copy:focus{
  background-color: #48A1C1;
  border-bottom: 2px solid #38AFDD;
  /*transition cross browser*/
  transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -moz-transition:all .3s ease-in;
  -o-transition: all .3s ease-in;
}

3、JS部分
var clipboard = new Clipboard('.btn-copy', {
    text: function() {
        return document.querySelector('input[type=hidden]').value;
    }
});
clipboard.on('success', function(e) {
  alert("Copied!");
  e.clearSelection();
});
$("#input-url").val(location.href);
//safari
if (navigator.vendor.indexOf("Apple")==0 && /\sSafari\//.test(navigator.userAgent)) {
   $('.btn-copy').on('click', function() {
var msg = window.prompt("Copy this link", location.href);

});
  }

4、以下是我的实际实例，flask渲染表格

{% for v in page_data.items %}

    {{ v.name }}
    {{ v.website }}
    {{ v.username }}
    
        

        ************
        复制
    
    {{ v.comment }}
    
        编辑
        删除
    

{% endfor %}

修改后的版本

有些clipboard.min.js 加载进来不生效，我这边上传一个可以用的

https://cdn.jsdelivr.net/clipboard.js/1.5.10/clipboard.min.js