我的JS代码:
function getSelectedText(){
if(window.getSelection){
select = window.getSelection().getRangeAt(0);
var st_span = select.startContainer.parentNode.getAttribute("id").split("_")[1];
var end_span = select.endContainer.parentNode.getAttribute("id").split("_")[1];
console.log(select.endContainer);
var ret_urn=[st_span,end_span];
return ret_urn
}
else if(document.getSelection){
return document.getSelection();
}
}
$(document).ready(function() {
$("div#check_button button").click(function () {
var loc = getSelectedText();
console.log(loc);
});
});
这是我的整个html文件:http://pastebin.com/acdiU623
这很难解释,所以我准备了短片:http://www.youtube.com/watch?v=tVk4K70JO80
简而言之:当我按下鼠标左键并按住它来选择文本/数字并从字母/数字的一半开始选择时,虽然这个字母/数字没有突出显示,但它会被添加到选择中.我必须准确地开始选择.宽字母可以,但是用i,j或l等字母很难.
这是我电影的第二个例子.我按了5号长度的3/4处的左按钮,虽然没有突出显示5,但它被选中.
在FF和Opera上测试过.
解决方法:
好的,试过这个演示.它完美无瑕.它甚至适用于Firefox.刚刚测试过的歌剧和野生动物园,它也适用于它们.即使我选择半个字母或数字,它也会返回突出显示的文本,这是您进行选择时所期望的.
尽管只是为了测试目的,在新的网页上试一试.然后当它工作并且您对结果感到满意时,然后开始对现有页面进行更改.
它比你的代码简单得多.这是一个跨浏览器的脚本,用于获取用户选择的文本
<script language=javascript>
function getSelText()
{
var txt = '';
if (window.getSelection)
{
txt = window.getSelection();
}
else if (document.getSelection)
{
txt = document.getSelection();
}
else if (document.selection)
{
txt = document.selection.createRange().text;
}
else return;
document.aform.selectedtext.value = txt;
}
</script>
<input type="button" value="Get selection" onm ousedown="getSelText()">
<form name=aform >
<textarea name="selectedtext" rows="5" cols="20"></textarea>
</form>
http://www.codetoad.com/javascript_get_selected_text.asp
希望这可以帮助.
PK