2015-07-21 41 views
0

我试图找到关于此的信息,并且有很多但没有处理这个特定问题。链接 - 将信息复制到剪贴板

我有我们公司的图形用户界面,我们需要这样做,当你点击客户的名字时,它会将“电话号码”复制到剪贴板。

我不知道该如何去做。显示的名称只是客户名称,但只需单击客户名称,我就需要将与其关联的电话号码“复制到剪贴板”。

现在我们将它设置为我们旧VoIP的点击通话。 电话号码信息 - 文本显示为客户姓名。

任何有关如何通过点击客户名称来获取特定字段的信息“复制到剪贴板”的想法。

+0

@ShrinivasShukla这不是真的了。 –

+0

[如何在不使用Flash的情况下在HTML5中复制剪贴板?](http://stackoverflow.com/questions/26336138/how-can-i-copy-to-clipboard-in-html5-without-using -flash) –

+0

@ Kevinj87看一看[this](http://www.htmlgoodies.com/html5/other/working-with-clipboard-apis-in-html5-web-apps.html#fbid=W4qPrRYxkYI) 。 –

回答

0

我不知道你的html是如何设置的,但你可以像这样设置它并使用document.execCommand('copy')复制到剪贴板。

// our hidden textarea, where we pass the text which we want to copy, to 
 
var copyarea = document.createElement("textarea"); 
 
copyarea.style.cssText = 'position:absolute; left: -1000px; top: -1000px;'; 
 

 
function copyPhoneNumber(text) { 
 
    document.body.appendChild(copyarea); 
 
    copyarea.value = this.dataset.phone; 
 
    copyarea.select(); 
 
    document.execCommand('copy'); 
 
    document.body.removeChild(copyarea); 
 
}; 
 

 
var customers = document.querySelectorAll(".customer"); 
 
for(var i = 0; i < customers.length; i++) { 
 
    customers[i].addEventListener("click", copyPhoneNumber); 
 
}
.customer { color: blue; text-decoration:underline; } 
 
.customer:hover { text-decoration:none; cursor:pointer }
Just click on a name <span class="customer" data-phone="123">Name 1</span> 
 
<span class="customer" data-phone="234">Name 2</span> 
 
<span class="customer" data-phone="345">Name 3</span>

您还可以通过功能检测document.execCommand('copy')并回落至不同的方法进行复制,如果它是不可用改善这一点。