效果:在网页中选中一段内容后,自动弹出一个按钮,点击按钮可以将选中的内容回发到服务器。
实现方法:用javascript添加document.onmouseup事件,用range API判断是否选中内容,选中内容则弹出按钮,给按钮绑定点击事件,点击后将选中的内容使用ajax发送到服务器端。
选中网页内容弹出按钮点击发送选中内容到服务器源代码如下
#btnSend{position:absolute;display:none;}
var selectedText;
function ajaxSend(){alert(selectedText)
$('#btnSend').attr('disabled',true)
$.ajax({url:'xxxx.ashx',type:'POST',data:{s:selectedText},complete:function(xhr){
alert('ajax请求完毕,服务器返回内容:'+xhr.responseText);
$('#btnSend').hide();
}});
}
document.οnmοusedοwn=function(){selectedText=false;}
document.οnmοuseup=function(e){
e=e||window.event;
selectedText=window.getSelection?window.getSelection().toString():document.selection?document.selection.createRange().text:false;
if(selectedText){
//判断页面是否有滚动,有的话还得加上滚动的距离,要不按钮定位不准
var sl=Math.max(document.documentElement.scrollLeft,document.body.scrollLeft),
st=Math.max(document.documentElement.scrollTop,document.body.scrollTop);
$('#btnSend').css({left:e.clientX+sl,top:e.clientY+st}).show().attr('disabled',false);
}
else $('#btnSend').hide();
}
效果:在网页中选中一段内容后,自动弹出一个按钮,点击按钮可以将选中的内容回发到服务器。
实现方法:用javascript添加document.onmouseup事件,用range API判断是否选中内容,选中内容则弹出按钮,给按钮绑定点击事件,点击后将选中的内容使用ajax发送到服务器端。
选中网页内容弹出按钮点击发送选中内容到服务器源代码如下
实现方法:用javascript添加document.onmouseup事件,用range API判断是否选中内容,选中内容则弹出按钮,给按钮绑定点击事件,点击后将选中的内容使用ajax发送到服务器端。
选中网页内容弹出按钮点击发送选中内容到服务器源代码如下
xxxx.ashx
string s=context.Request.Form["s"];
context.Response.Write(s+"--"+DateTime.Now);
加支付宝好友偷能量挖...
2015-5-3Web开发网