我使⽤的是 Command('copy')的⽅法;
但是很郁闷的是,始终实现不了功能;代码如下
HTML代码
(v-model是vue框架中的双向数据绑定,不懂的请移步vue⽂档)
<input id='input_url' v-model='product_url' disabled type="text">
JS代码
var input = $('#input_url');
input.select();
html input type属性
然后就郁闷了,就这么⼏⾏代码,为啥不⾏呢?JS和⽹上写的⼀模⼀样啊??
现在来解释为啥失败,踩了⼏个⼩时的坑
不能实现的原因:
input框不能有disabled属性
根据第⼀条扩展,input的width || height 不能为0;
input框不能有hidden属性
意思就是,input框要在正常的编辑状态下,暂且这么解释吧;
解决⽅案:
因为业务逻辑上input框确实不能编辑,所以disabled属性是必须要的;
那我⽤另⼀个input框展⽰相同的数据,然后设置opacity=0;这样就不可见了;(注意这⾥⽤hidden也是不⾏的)
但是新增的input还是占有空间,所以再来个粗暴的样式 position: absolute;这样就脱离了⽂档流;
JS代码不变,修改HTML如下:
<input id='input_url' v-model='product_url' style='opacity: 0;position: absolute;' type="text">
<input v-model='product_url' disabled type="text">