Javascript复制函数不工作的输入类型隐藏

Question

我试图保留input type=hidden，但它不复制值，我需要隐藏输入字段并保持复制功能完整，有人有解决方案吗?

<button class="btn btn-primary" onclick="copy_link()">copy;<i class="fa fa-check"></i></button>
<input  id="my_link" type="text" class="form-control" value="test123 " />
<script>
function copy_link() {
/* Get the text field */
var copyText = document.getElementById("my_link");
/* Select the text field */
copyText.select();
/* Copy the text inside the text field */
document.execCommand("copy");
$('#copy_alert').show();

}
$(document).ready(function() {
$('#copy_alert').hide();
});
</script>

Answer 1

function copy_link() {
/* Get the text field */
var copyText = document.getElementById("my_link");
/* Select the text field */
copyText.select();
/* Copy the text inside the text field */
document.execCommand("copy");
$('#copy_alert').show();
console.log(copyText.value);
}
$(document).ready(function() {
$('#copy_alert').hide();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="btn btn-primary" onclick="copy_link()">copy;<i class="fa fa-check"></i></button>
<input id="my_link" type="text" class="form-control" value="test123 " />

注意:-你必须以JavaScript的形式打印变量名和它的值。像这样copyText.value将解决您的问题

Answer 2

你是说inputmode吗?如果是这样，inputmode= " none "可能就是您要找的。我在这篇文章中找不到"隐藏":https://css-tricks.com/everything-you-ever-wanted-to-know-about-inputmode/

Answer 3

我自己解决了这是解决方案:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
function setClipboard(value) {
var tempInput = document.createElement("input");
tempInput.style = "position: absolute; left: -1000px; top: -1000px";
tempInput.value = value;
document.body.appendChild(tempInput);
tempInput.select();
document.execCommand("copy");
document.body.removeChild(tempInput);
$('#copy_alert').show();
}
$(document).ready(function() {
$('#copy_alert').hide();
});
</script>

<button onclick="setClipboard('copytest')" class="btn btn-light">Copy</button>