做了一个简单的demo，你可以看下效果，应该是你想要的：
http://jsbin.com/afuqur/1/
关键代码：
(function($){ $.fn.extend({ "selectText":function(value){ value=$.extend({ "delays":300 },value); var $this = $(this); //鼠标抬起进，获取选择文字的字数。并根据字数，是否显示弹出层 $this.mouseup(function(event){ //IE和火狐兼容性的处理函数。 function selectText(){ if(document.selection){ return document.selection.createRange().text;// IE }else{ return window.getSelection().toString(); //标准 } } var str = selectText(); var l = event.clientX; var t = event.clientY; if(str.length > 0){ $this.next("div").html(str).css({"top":t+10,"left":l+10}).delay(value.delays).fadeIn(); } }); //点击文档任何位置，让显示的层消失 $(document).click(function(){ $this.next("div").fadeOut(); }) //阻止冒泡，防止第一次选中文字时，由于冒泡，而触发了$(document).click事件 $this.click(function(event){ event.stopPropagation(); }); return $this; } }) })(jQuery)<、pre> HTML： <!DOCTYPE html> <html> <head> <meta name="description" content="[add your bin description]" /> <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> <meta charset=utf-8 /> <title>JS Bin</title> </head> <body> <p class="sel" >这是一段测试文字 .................. </p> <div class="tip"></div> </body> </html> 示例代码也 可以在这里查看。
<!DOCTYPE html> <html> <head> <meta name="description" content="[add your bin description]" /> <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> <meta charset=utf-8 /> <title>JS Bin</title> </head> <body> <p class="sel" >这是一段测试文字 .................. </p> <div class="tip"></div> </body> </html>
示例代码也 可以在这里查看。
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
暂无简介
文章 0 评论 0
接受
发布评论
评论（1）
做了一个简单的demo，你可以看下效果，应该是你想要的：
http://jsbin.com/afuqur/1/
关键代码：
(function($){ $.fn.extend({ "selectText":function(value){ value=$.extend({ "delays":300 },value); var $this = $(this); //鼠标抬起进，获取选择文字的字数。并根据字数，是否显示弹出层 $this.mouseup(function(event){ //IE和火狐兼容性的处理函数。 function selectText(){ if(document.selection){ return document.selection.createRange().text;// IE }else{ return window.getSelection().toString(); //标准 } } var str = selectText(); var l = event.clientX; var t = event.clientY; if(str.length > 0){ $this.next("div").html(str).css({"top":t+10,"left":l+10}).delay(value.delays).fadeIn(); } }); //点击文档任何位置，让显示的层消失 $(document).click(function(){ $this.next("div").fadeOut(); }) //阻止冒泡，防止第一次选中文字时，由于冒泡，而触发了$(document).click事件 $this.click(function(event){ event.stopPropagation(); }); return $this; } }) })(jQuery)<、pre> HTML：示例代码也 可以在这里查看。