我正在尝试使用JavaScript开发打字速度竞赛.人们应该把他们从div看到的所有单词写成textarea.
为了防止作弊(比如从div复制单词),一种方法是只在键盘按键关闭时检查写入的单词,但我想知道是否有办法阻止用户在浏览器中复制文本？
到目前为止我尝试了什么:
使用任何库都可以.
<html>
<input type="button" id="btnSearch" value="Search" onclick="GetValue();" />
<p id="message" ></p>
<script>
function GetValue()
{
var myarray= new Array("item1","item2","item3");
var random = myarray[Math.floor(Math.random() * myarray.length)];
//alert(random);
document.getElementById("message").innerHTML=random;
}
</script>
</html>
这是代码,当我生成一个随机单词让我们说"item1"显示,我怎么能在它下面添加一个按钮,当我点击它复制"item1"
我花了一些时间试图找出一个解决方案,该解决方案可以复制HTML中的多行列表,从按钮上删除标签和缩进,而无需使用Flash.在我的研究中,我遇到了" jQuery单击按钮复制到剪贴板 ",我测试了Alvaro Montoro的答案,但该解决方案不适用于多行列表,但它适用于段落文本.我不打算支持Clipbaord API,因为它显示了跨浏览器的非常有限的支持.进一步研究我遇到了" HTML5替代基于闪存的ZeroClipboard以便安全地将数据复制到剪贴板？ "而Thayne的答案链接到博客文章但它会复制所有的HTML.我已经弄清楚如何剥离标签和缩进:
HTML:
<button onclick="copyToClipboard('#therecipe')">Copy List</button>
<div class="listing">
<ul id="someList">
<li>1 million</li>
<li>Monday</li>
<li>Something</li>
<li>Foobar</li>
<li>1tsp blah</li>
</ul>
</div>
<textarea class="auto"></textarea>
jQuery的:
$('button').click(function(element) {
var thelist = $('#someList').html();
thelist = thelist.replace(/\s+<li>/g, '');
thelist = thelist.replace(/<\/?li>/g, '\r');
$('.auto').val(thelist);
});
如何使用jQuery复制多行列表项,删除标签,删除缩进,并在不使用Flash的情况下复制到剪贴板？是否有支持我没有看到的所有最新浏览器的插件？
我有一个简单的输入：
<input type="date" class="self-select" value="1980-05-04">
<input type="text" class="self-select" value="my birthday">
我有一个监听所有这些输入的监听器：
$(document).on('focus', '.self-select', function(){
$(this).select();
});
这个想法是，当用户单击输入字段时，其内容被选择，因此他只需要 ctrl+c 即可复制。
但这在 Chrome 中不起作用type="date"。没有选择，基本上也没有办法从输入字段复制日期值。
在我们的应用程序中，我们使用以下逻辑将 HTML（文本和格式）复制到剪贴板。
function copy(element_id)
{
var aux = document.createElement("div");
aux.setAttribute("contentEditable", true);
aux.innerHTML = document.getElementById(element_id).innerHTML;
aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)");
document.body.appendChild(aux);
aux.focus();
document.execCommand("copy");
document.body.removeChild(aux);
console.log("COPY");
}<p id="demo"><b>Bold text</b> and <u>underlined text</u>.</p>
<button onclick="copy('demo')">Copy To Clipboard Keeping Format</button>它在所有主要浏览器（Chrome、Firefox、Edge 和 Internet Explorer）中都运行良好。
使用最新的 Internet Explorer 版本 11.125.16299.0（更新版本：11.0.49 - KB4052978），HTML 不再复制到剪贴板。
对此有一个安全设置：
Options -> Security -> Edit level ... -> Scripting -> Allow access to clipboard
我将值从“询问”更改为“已激活”。这没有效果。
有谁知道为什么，他们改变了什么，也许是另一种解决方案或解决方法？谢谢你。
我想使用jquery将文本复制到剪贴板.但是在某个地方我很想念.我有以下代码:
<span class="copy-btn" data-type="attribute" data-attr-name="data-clipboard-text" data-model="couponCode" data-clipboard-text="<?php echo $result->coupon_code; ?>">COPY CODE</span>
</div>
而jquery如下:
$(document).ready(function(){
$('.copy-btn').on("click", function(){
value = $(this).data('clipboard-text'); //Upto this I am getting value
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(value).text()).select();
document.execCommand("copy");
$temp.remove();
})
})
所以请纠正我,如何将代码复制到剪贴板.我得到了文本的价值,但在那之后我无法继续.
我正在尝试遵循以下代码：https : //www.w3schools.com/howto/howto_js_copy_clipboard.asp
HTML模态：
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">App Link</h4>
</div>
<div class="modal-body">
<input id="appID" value="123"></input>
<button type="button" class="btn btn-success" id="copyBtn">Copy</button>
</div>
</div>
</div>
</div>
这是我的JS：
var copyBtn = document.getElementById('copyBtn');
copyBtn.onclick = function(){
var myCode = document.getElementById('appID').value;
var fullLink = document.createElement('input');
document.body.appendChild(fullLink);
fullLink.value = "http://fulllink/" + myCode;
fullLink.select();
document.execCommand("copy", false);
fullLink.remove();
alert("Copied the text: " + fullLink.value);
}
Code will not …
有没有办法通过单击其他元素将元素内容复制到剪贴板？
我看到了很多相关的问题，但我不喜欢使用函数的方法。
因为数据来自数据库。
这是我的示例代码。
$(document).ready(function(){
$(".click .copy").click(function(){
$(this).closest("click").find("span").text();
document.execCommand("Copy");
});
});.click{
padding: 10px;
}
.click .copy{
background-color: rgba(0,0,0,.8);
padding: 3px;
border-radius: 12px;
position: absolute;
margin-top: -2px;
width: 80px;
cursor: pointer;
color: #f7cc83;
display: none;
text-align: center;
}
.click:hover .copy{
display: block;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="click">
<div class="copy">copy text</div>
<span>copy this text 1</span>
</div>
<div class="click">
<div class="copy">copy text</div>
<span>copy this text 2</span>
</div>
<div class="click">
<div class="copy">copy text</div>
<span>copy this text 3</span>
</div>首先，我是javascript的初学者，我只想了解一下点击切换。我正在制作一个像flatuicolors.com的网站，当您单击div时，它将复制颜色。我已经在P标签的每个div中写入了每种颜色，并且想知道是否可以单击以在该div中复制P标签。
<div class="main-colour-container col-group-1">
<div class="colours-featured" id="div2">
<div class="colour-box" style="background:#F22613;">
<div class="inside-colour-box">
<div class="colour-box-text fade">
<p>#F22613</p>
</div>
</div>
</div>
<div class="colour-box" style="background:#F44336;">
<div class="inside-colour-box">
<div class="colour-box-text fade">
<p>#F44336</p>
</div>
</div>
</div>
<div class="colour-box" style="background:#C62828;">
<div class="inside-colour-box">
<div class="colour-box-text fade">
<p>#C62828</p>
</div>
</div>
</div>
<div class="colour-box" style="background:#DB3D45;">
<div class="inside-colour-box">
<div class="colour-box-text fade">
<p>#DB3D45</p>
</div>
</div>
</div>
</div>
</div>
我在按钮属性中有一些带有一些文本的按钮，我想要的是当我点击按钮时它会复制到剪贴板
$('.copyboard').on('click', function(e) {
e.preventDefault();
var copyText = $(this).attr('data-text');
console.log(copyText);
copyText.text().select();
document.execCommand("copy");
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button data-text="Hello World 1" class="copyboard">Copy</button></div>
<button data-text="Hello World 2" class="copyboard">Copy</button></div>
<button data-text="Hello World 3" class="copyboard">Copy</button></div>当我点击它返回这个：
未捕获的类型错误：copyText.select 不是函数