android - 选择 [CSS, JS, android] 时阻止标准操作

Question

我在 android webview 中制作了一个应用程序，我希望可以复制某些内容。因此，当您按下按钮时，您会将某些内容复制到剪贴板。 我试过"clipboard.js"适用于浏览器，但不适用于 Android。所以我使用了这个 javascript:

var copyXBT = function () {
var theTheCopyXBTAdr = $('#theToCopyXBT');
theTheCopyXBTAdr.select();
try {
    var successful = document.execCommand('copy');
    var msg = successful ? 'successful' : 'unsuccessful';
    console.log('Copying text command was ' + msg);
} catch (err) {
    console.log('Oops, unable to copy');
}

};

但是当你按下输入类型时，文本会变成蓝色，..和蓝色边框(android webview 黄色)并且在 android 上你的键盘会弹出。

我使用这个 css 样式来“隐藏”它。因为我不能说不显示。如果我这样做，我将无法工作。

#theToCopyETH{
color: white;
border: 0px solid white;
}

::selection{
    background: white;
    color: white;
}

这是我的一段 HTML:

<button class="btn btn-coinchecker" id="copyETH">Copy ETH address</button><button class="btn btn-coinchecker" data-toggle="modal" data-target="#showETHQR">Click me to get the QR-code</button>
        <input type="text" id="theToCopyETH" value="*********************">

参见 fiddle例如(请在谷歌浏览器中打开)

所以我的问题是如何防止键盘弹出并摆脱android中的黄色边框(桌面上的谷歌浏览器是蓝色的)

在此先感谢您对我的帮助!

Answer 1

我找到了答案。

我需要做什么来隐藏我的键盘是这个 js:

enter var hidekeyboard = function (e) {
    e.attr('readonly', 'readonly'); // Force keyboard to hide on input field.
    e.attr('disabled', 'true'); // Force keyboard to hide on textarea field.
    setTimeout(function() {
        e.blur();  //actually close the keyboard
        // Remove readonly attribute after keyboard is hidden.
        e.removeAttr('readonly');
        e.removeAttr('disabled');
    }, 100)
};

我需要在我的选择发生后添加，否则我将无法工作。 我的 copyETH 看起来像这样:

var copyETH = function () {
var theTheCopyETHAdr = $('#theToCopyETH');
theTheCopyETHAdr.removeClass('toggleDisplay');
theTheCopyETHAdr.select();
try {
    var successful = document.execCommand('copy');
    var msg = successful ? 'successful' : 'unsuccessful';
    console.log('Copying text command was ' + msg);
} catch (err) {
    console.log('Oops, unable to copy');
}
hidekeyboard(theTheCopyETHAdr);
theTheCopyETHAdr.addClass('toggleDisplay');
};

因此您可以看到我还执行了 removeClass 和 addClass。因为如果我只使用 hidekeyboard 你可以看到选择但是他的 css 类已经消失了 + 没有人可以更改输入字段。

这里看解决fiddle