这个问题主要是监听 onpaste (鼠标右键粘贴或 Ctrl + V)。
如果 input 值为空，那么很简单，在 onpaste 之后获取 input 的值就是被粘贴的内容。
但如果 input 内已经有内容，用户选择在中间部位粘贴，或者选择一部分内容后再粘贴 (替换粘贴)，那实施起来就比较复杂。下面是完整的代码
function getSelectionBoundary(el, start) {var property = start ? "selectionStart" : "selectionEnd"
var originalValue, textInputRange, precedingRange
, pos, bookmark, isAtEnd
if(typeof el[property] == "number") {
return el[property]
}
else if(document.selection &&document.selection.createRange) {
el.focus()
var range = document.selection.createRange()
if(range) {
if(document.selection.type == "Text") {
range.collapse(!!start)
}
originalValue = el.value
textInputRange = el.createTextRange()
precedingRange = el.createTextRange()
pos = 0
bookmark = range.getBookmark()
textInputRange.moveToBookmark(bookmark)
if(/[\r\n]/.test(originalValue)) {
try {
range.move("character", 1)
isAtEnd = (range.parentElement() != el)
}
catch(ex) {
isAtEnd = true
}
range.moveToBookmark(bookmark)
if(isAtEnd) {
pos = originalValue.length
}
else {
textInputRange.text = " "
precedingRange.setEndPoint("EndToStart",
textInputRange)
pos = precedingRange.text.length - 1
textInputRange.moveStart("character", -1)
textInputRange.text = ""
}
}
else {
precedingRange.setEndPoint("EndToStart", textInputRange)
pos = precedingRange.text.length
}
return pos
}
}
return 0
}
function getInputSelection(ele) {
var start = getSelectionBoundary(ele, true),
end = getSelectionBoundary(ele, false)
return {
start: start,
end: end,
length: end - start,
text: ele.value.slice(start, end)
}
}
function detectPaste(ele, callback) {
ele.onpaste = function() {
var sel = getInputSelection(ele)
var initialLength = ele.value.length
window.setTimeout(function() {
var val = ele.value
var pastedTextLength =
val.length - (initialLength - sel.length)
var end = sel.start + pastedTextLength
callback({
start: sel.start,
end: end,
length: pastedTextLength,
text: val.slice(sel.start, end),
replacedText: sel.text
})
}, 1)
}
}
以上都是监听 onpaste 和获取粘贴内容的函数，下面是用法。（如果你只是使用，不需要理解上面代码的内容）
window.onload = function() {// 获取要监听的 input 或 textarea
var content = document.getElementById("content")
// 开始监听，第二个参数为回调函数，返回一个对象，其中包括
// start: 光标开始位置，end: 粘贴后光标位置
// length: 粘贴内容的长度，replacedtext: 被替换的内容
// text: 这个就是被粘贴的内容
detectPaste(content, function(pasteInfo) {
alert(pasteInfo.text)
})
} <input type="text" id="content" value="" />
1、最基本的复制Java代码
<script language="JavaScript">
function readTxt()
{
alert(window.clipboardData.getData("text"))
}
function setTxt()
{
var t=document.getElementById("txt")
t.select()
window.clipboardData.setData('text',t.createTextRange().text)
}
</script>
<input name="txt" value="测试">
<input type="button" value="复制" onclick="setTxt()">
<input type="button" value="读取" onclick="readTxt()">
2、扩展复制：复制表格
Java代码
<INPUT TYPE="button" value="选中测试表格" onclick="CopyTable()">
测试
<TABLE border="1" id="oTable">
<TR>
<TD>测试表格</TD>
<TD>测试表格</TD>
</TR>
<TR>
<TD>测试表格</TD>
<TD>测试表格</TD>
</TR>
</TABLE>文字
<SCRIPT LANGUAGE="JavaScript">
<!--
function CopyTable()
{
var txt = document.body.createTextRange()
txt.moveToElementText(document.getElementById('oTable'))
txt.select()
}
//-->
</SCRIPT>
、兼容IE，firefox等浏览器的复制
Java代码
<script>
function copyToClipboard(txt) {
if(window.clipboardData) {
window.clipboardData.clearData()
window.clipboardData.setData("Text", txt)
} else if(navigator.userAgent.indexOf("Opera") != -1) {
window.location = txt
} else if (window.netscape) {
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect")
} catch (e) {
alert("被浏览器拒绝！\n请在浏览器地址栏输入'about:config'并回车\n然后将'signed.applets.codebase_principal_support'设置为'true'")
}
var clip = Components.classes['@mozilla.org/widget/clipboard1'].createInstance(Components.interfaces.nsIClipboard)
if (!clip)
return
var trans = Components.classes['@mozilla.org/widget/transferable1'].createInstance(Components.interfaces.nsITransferable)
if (!trans)
return
trans.addDataFlavor('text/unicode')
var str = new Object()
var len = new Object()
var str = Components.classes["@mozilla.org/supports-string1"].createInstance(Components.interfaces.nsISupportsString)
var copytext = txt
str.data = copytext
trans.setTransferData("text/unicode",str,copytext.length*2)
var clipid = Components.interfaces.nsIClipboard
if (!clip)
return false
clip.setData(trans,null,clipid.kGlobalClipboard)
}
}
</script>
<button onclick="copyToClipboard('你好！')">复制文本“你好！”</button>
<textarea id="test"></textarea>
