jquery 如何监听黏贴事件，并把黏贴内容插入到光标之后？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

这是一个创建于 4118 天前的主题，其中的信息可能已经有所发展或是发生改变。

有下面一个div 内容：
<div class='content' id='"+ id +"-content' contenteditable='true' spellcheck='false'> </div>

我想实在像富文本编辑器那样的功能，可以黏贴内容，插入到光标的位置。
监听事件是这样写的：
$(".content").live('paste', function (e) {
var self = this;
setTimeout(function() {
var paste_values = $(self).text();
var new_values = $.htmlClean(paste_values, { format: true,allowedTags:["a",] });//清除HTML格式。
$(self).text(new_values);
},0);
});

但是这样的话，会同时取出所有的内容，包括黏贴之前的内容也会被清除掉格式，这不是我想要的，所有原先内容的格式都希望保留，只想单纯把新黏贴的内容取出并去掉所有html格式。

请问，这该如何做呢？
问题一：如何取出黏贴的内容，如我上面的代码中，$(self).text(); 这样会取出editor中所有的内容。我只想要黏贴的内容
问题二：如果把这个内容播放到光标位置之后？

请大家帮帮忙。谢谢。

黏贴

内容

values

16 条回复 • 1970-01-01 08:00:00 +08:00

ljbha007

2013-01-28 00:33:23 +08:00

$(".content").live('paste', function (e) {
var self = this;
var prev_len = $(self).text().length;
setTimeout(function() {
var now_len = $(self).text().length;
var paste_values = $(self).text().slice(prev_len, now_len - prev_len);
var new_values = $.htmlClean(paste_values, { format: true,allowedTags:["a",] });//清除HTML格式。
$(self).text(new_values);
},0);
});

ljbha007

2013-01-28 00:34:23 +08:00

$(".content").live('paste', function (e) {
var self = this;
var prev_len = $(self).text().length;
setTimeout(function() {
var now_len = $(self).text().length;
var paste_values = $(self).text().slice(prev_len, now_len - prev_len);
var old_values = $(self).text().slice(0, prev_len);
var new_values = $.htmlClean(paste_values, { format: true,allowedTags:["a",] });//清除HTML格式。

$(self).text(old_values + new_values);
},0);
});

yeelone

2013-01-28 11:01:53 +08:00

@ljbha007 谢谢。

NemoAlex

2013-01-28 11:17:03 +08:00

标题这什么字？怎么读啊？
楼主用的什么输入法？“粘贴”都打不出来么？

yeelone

2013-01-28 11:19:07 +08:00

@ljbha007 HI,想再请问你一个问题，因为黏贴嘛，是黏贴在光标的位置，但是如上代码中，是默认认为黏贴的内容是在最后，但有时候是在中间某个位置，所以如何做到，把黏贴的内容插入到光标位置之后呢？
我在想，先取出光标之前的内容，光标之后的内容，再把黏贴的内容插入在中间。
但是问题，我不知道怎么取出光标的位置，在网上找了很多代码，都没有用。
比如：

$.fn.getCursorPosition = function() {
var el = $(this).get(0);
var pos = 0;
if('selectionStart' in el) {
console.log('selectionStart');
pos = el.selectionStart;
} else if('selection' in document) {
console.log('selection');
el.focus();
var Sel = document.selection.createRange();
var SelLength = document.selection.createRange().text.length;
Sel.moveStart('character', -el.value.length);
pos = Sel.text.length - SelLength;
}
return pos;
}

两个if 都没有进去。

ljbha007

2013-01-28 11:21:57 +08:00

@yeelone
我也得慢慢去研究啦
刚才干了个很蠢的事现在没心情研究了
http://www.v2ex.com/t/58974#reply12