H5 输入框在部分ios手机上无法复制粘贴

最近在做公司周年庆活动页的时候,遇到一个巨奇葩的问题,为什么说奇葩呢,因为测试的时候,好几个测试机都没有问题,只有iphone7那个手机死活没有办法将复制的文字粘贴到我页面的输入框。

我在网上找了很多很多方法,有人说用js自动给当前输入框获取焦点。就是这样

// html

<input id="input" value="value"></input>

用js给上面的input自动获取焦点。

function clickInput () {
    let input = document.getElementById('input')
    input.focus()
}

亲自试过,不行,不行。

还有人说,ios默认user-select: none;所以要给它设置为auto

#input {
    -webkit-touch-callout: none;
   -webkit-user-select: none;
    -webkit-user-select: text !important;
    -khtml-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
    -o-user-select: text !important;
    user-select: text !important;
}

可是!!!救命!我加上这个还是不行,我想了一下,获取是应该写成行内样式。

style="-webkit-user-select: auto; user-select: auto;"

当然,答案还是不行的。上面这些答案,获取有缘人遇到了刚好运气就那么好,你可以试试。

最后,我想是不是换个输入框就可以了,抱着试试,不行就去找测试battle,说:这个bug没法修!

然后我换成这样:

<textarea
        v-model="value"
        col="1"
        row="1"
        type="text"
        placeholder="INPUT YOUR UID"
        class="input"
        name=""
      />

居然成了!!!

居然可以了。

但众所周知,textarea和input还是有区别的,所以,要设置row = 1, col= 1,让它浑水摸鱼的充当一个input输入框吧。

OK~~~解决方案 get + 1

🎉🎉🎉

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值