Javascript 如何在asp.net上复制到客户端剪贴板按钮单击
我目前正在为一个项目使用ASP.NET 4.7 webforms,我正在尝试将在后端生成的数据复制到用户客户端计算机 换句话说,当用户提交表单时,需要将在后端生成的代码复制到用户剪贴板 这是我的尝试 Application.aspx.csJavascript 如何在asp.net上复制到客户端剪贴板按钮单击,javascript,asp.net,.net,webforms,Javascript,Asp.net,.net,Webforms,我目前正在为一个项目使用ASP.NET 4.7 webforms,我正在尝试将在后端生成的数据复制到用户客户端计算机 换句话说,当用户提交表单时,需要将在后端生成的代码复制到用户剪贴板 这是我的尝试 Application.aspx.cs . . . protected void Submit(object sender, EventArgs e) { try { ClientScript.RegisterStartupScr
.
.
.
protected void Submit(object sender, EventArgs e)
{
try
{
ClientScript.RegisterStartupScript(GetType(), "hwa", "copyToClipboard("+encodedValue+");", true);
}
catch (Exception ex)
{
}
}
Application.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Application.aspx.cs" Inherits="azureCopyToClipboard.Application" %>
<!DOCTYPE html>
<form id="form1" runat="server">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<div>
<asp:Button ID="SubmitButton" runat="server" class="btn btn-primary " OnClick="Submit" Text="Submit" />
</div>
</body>
</html>
<script type="text/javascript">
function copyToClipboard(textToCopy) {
var textArea;
function isOS() {
//can use a better detection logic here
return navigator.userAgent.match(/ipad|iphone/i);
}
function createTextArea(text) {
textArea = document.createElement('textArea');
textArea.readOnly = true;
textArea.contentEditable = true;
textArea.value = text;
document.body.appendChild(textArea);
}
function selectText() {
var range, selection;
if (isOS()) {
range = document.createRange();
range.selectNodeContents(textArea);
selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
textArea.setSelectionRange(0, 999999);
} else {
textArea.select();
}
}
function copyTo() {
document.execCommand('copy');
document.body.removeChild(textArea);
}
createTextArea(textToCopy);
selectText();
copyTo();
}
</script>
</form>
功能copyToClipboard(文本复制){
可变区;
函数isOS(){
//这里可以使用更好的检测逻辑
返回navigator.userAgent.match(/ipad | iphone/i);
}
函数createTextArea(文本){
textArea=document.createElement('textArea');
textArea.readOnly=true;
textArea.contentEditable=true;
textArea.value=文本;
document.body.appendChild(textArea);
}
函数selectText(){
var范围、选择;
if(isOS()){
range=document.createRange();
范围。选择节点内容(文本区域);
selection=window.getSelection();
selection.removeAllRanges();
选择。添加范围(范围);
textArea.setSelectionRange(099999);
}否则{
textArea.select();
}
}
函数copyTo(){
document.execCommand('copy');
document.body.removeChild(textArea);
}
createTextArea(文本复制);
选择text();
copyTo();
}
我正在使用ClientScript.RegisterStartupScript调用客户端函数,以将编码值粘贴到用户剪贴板…但是由于现代浏览器安全原因,此尝试不起作用,我也没有得到任何客户端错误附加到此问题
我试图使此解决方案同时支持移动和非移动。不幸的是,大多数浏览器不允许您在没有正确的用户操作(例如在按钮单击事件中)的情况下写入剪贴板。否则,它可能被用于恶意目的;任何网站只需访问网站,就可以将任何内容写入剪贴板。在您的情况下,由于您执行了异步HTTP操作,您的按钮单击将丢失其自身的事件上下文,并且在服务器响应的成功回调函数中,您不再具有写入剪贴板的权限
我的建议,以及大多数网站正在做的是;在一个漂亮的大模式窗口中显示结果代码,并带有一个漂亮的“复制到剪贴板”“不工作”按钮。“不工作”实际上是一个毫无意义的问题陈述,没有任何调试细节、错误和错误etc@charlietfl很抱歉我相信原因在于现代浏览器中的一些安全策略阻止了这种方式。。。正如在Stackoverflow的问题中提到的,这是一个基于旧浏览器的老问题。。。看一看@charlietfl谢谢,我检查了你发布的URL,我尝试了两个函数,execCommand()&剪贴板API..这两个函数都可以在我的桌面chrome上使用我上面的代码…但是没有在iPadIs上复制到剪贴板它也是chrome吗?每个浏览器/操作系统可能仍会遇到安全问题。我已经很多年没有使用剪贴板api了。这是事实,我曾经体验过当我向我的方法添加http请求时,剪贴板功能停止工作。我将添加一个额外的步骤,用户可以点击“复制到剪贴板”,看看它是如何进行的。非常感谢。