ddddd

html实现复制功能

作者:程序员11 时间:2021-02-23 人气:356 QQ交流群\邮箱:1003265987@qq.com
解决思路:在input中显示要复制的文字,点击按钮复制input的value。主要用到document.execCommand("Copy"); //执行浏览器复制命令
要展示的内容

需要注意的是:1.input必须不能是隐藏的2.input框不能有disabled属性3.input的width || height 不能为0;

如果现实需求与上述条件冲突的话,用另一个input框展示相同的数据,然后设置opacity=0;这样就不可见了;但是新增的input还是占有空间,所以再来个粗暴的样式 position: absolute;这样就脱离了文档流;例如:

<input id="liveplaypath" type="text" name="liveplaypath" lay-verify="liveplaypath" autocomplete="off" placeholder="" class="layui-input" disabled>
<input id="liveplaypath1" type="text" lay-verify="liveplaypath1" autocomplete="off" placeholder="" class="layui-input liveplaypath1" style="opacity: 0;position: absolute;">
//需要注意的是:1.input必须不能是隐藏的2.input框不能有disabled属性3.input的width || height 不能为0;
var oInput = $(".livepath1");  //input 的ID
oInput.select(); //选择对象
document.execCommand("Copy"); //执行浏览器复制命令
layer.msg('推流地址拷贝成功');


温馨提示:

欢迎阅读本文章,觉得有用就多来支持一下,没有能帮到您,还有很多文章,希望有一天能帮到您。

html实现复制功能---相关文章


评论区

ddddd

程序员-学习的网站-想学习编程的码农可以进来看看

首页

视频教程

购物车

我的订单