将鼠标选中的文字发送到新浪微博
最近注意到新浪博客有个小功能，就是当鼠标选中一段文字时会浮现一个小图片，点击这个图片可以把选中内容发送到新浪微博，一时兴起昨晚就写了一个Demo玩了一下，代码超简单，没优化，有兴趣的朋友可以自己改进。
原理很简单，先获得鼠标选中文字，然后调用新浪博客中提供的页面，把文字作为参数传过去就OK了。
代码如下：
01
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
02
|
<head runat="server">
|
03
|
<title></title>
|
04
|
<style type="text/css">
|
05
|
.tooltip
|
06
|
{
|
07
|
width:120px;
|
08
|
height:23px;
|
09
|
line-height:23px;
|
10
|
background-color:#CCCCCC;
|
11
|
}
|
12
|
.tooltip a
|
13
|
{
|
14
|
color: #333333;
|
15
|
display: block;
|
16
|
font-size: 12px;
|
17
|
font-weight: bold;
|
18
|
text-indent: 10px;
|
19
|
}
|
20
|
</style>
|
21
|
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
|
22
|
<script type="text/javascript">
|
23
|
$(function () {
|
24
|
$("#blogContent").mouseup(function (e) {
|
25
|
var x = 10;
|
26
|
var y = 10;
|
27
|
var r = "";
|
28
|
if (document.selection) {
|
29
|
r = document.selection.createRange().text;
|
30
|
}
|
31
|
else if (window.getSelection()) {
|
32
|
r = window.getSelection();
|
33
|
}
|
34
|
if (r!= "") {
|
35
|
var bowen = "发送到新浪微博";
|
36
|
var tooltip = "<div id='tooltip' class='tooltip'><a onclick=ask('"+r+"')>"+ bowen + "</a></div>";
|
37
|
$("body").append(tooltip);
|
38
|
$("#tooltip").css({
|
39
|
"top": (e.pageY + y) + "px",
|
40
|
"left": (e.pageX + x) + "px",
|
41
|
"position": "absolute"
|
42
|
}).show("fast");
|
43
|
}
|
44
|
}).mousedown(function () {
|
45
|
$("#tooltip").remove();
|
46
|
});
|
47
|
})
|
48
|
49
|
function ask(r) {
|
50
|
if (r != "") {
|
51
|
window.open('http://v.t.sina.com.cn/share/share.php?searchPic=false&title='+r+'&url=http://www.nowwamagic.net&sourceUrl=http%3A%2F%2Fblog.sina.com.cn&content=utf-8&appkey=1617465124', '_blank', 'height=515, width=598, toolbar=no, menubar=no, scrollbars=auto, resizable=yes, location=no, status=yes');
|
52
|
}
|
53
|
}
|
54
|
</script>
|
55
|
</head>
|
56
|
<body>
|
57
|
<div id="blogContent">
|
58
|
words words words words words words words words words。
|
59
|
</div>
|
60
|
</body>
|
61
|
</html>
|
就这么简单哦，大家可以自己试试哈。当然获得选中文本还可以有其他操作，这儿只是取巧调用了新浪的页面，大家如果有兴趣可以自己创建应用自己实现。
jQuery技术阅读排行
-
2013-08-12
-
2013-04-09
-
2013-05-13
-
2013-08-12
-
2013-08-12
-
2013-08-12
-
2013-04-09
-
2013-08-12
最新文章
-
2013-08-12
-
2013-08-12
-
2013-08-12
-
2013-08-12
-
2013-08-12
-
2013-08-12
-
2013-08-12
-
2013-08-12
热门源码
