javascript 如何 取得鼠标所在位置的字符. - ITeye问答
如何 取得鼠标所在位置的字符?& 下面的代码实现点击时取得 鼠标所在位置的字符.&&& 鼠标移动时不好用.&
有做过类似的, 请给解答以下. 感激......
请在chrome中运行以下代码.
&!DOCTYPE HTML&&html&
&script type="text/javascript"&
function clicked( ev ){
var s = window.getSelection();
if( s.rangeCount & 0 ){
document.getElementById("currText").value = s.anchorNode.textContent.substring(s.baseOffset, s.baseOffset+1);
function mousemove( ev ){
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window, 0, ev.screenX, ev.screenY, ev.clientX, ev.clientY, false, false, false, false, 1, null );
document.body.dispatchEvent(evt);
&body onclick="clicked(event)"&
&div onmousemove="mousemove( event )" style="border:solid blue 1px"&&div&&/div&&div&&/div&&/div&
&input type="text" value="" id="currText"/&
&!DOCTYPE HTML&&html&&
&script type="text/javascript"&&
function mousemove( ev ){&
var s = window.getSelection();&
//console.log('s.toString()',s.toString());
&&& if( s.rangeCount & 0 ){&
&&&&&&& document.getElementById("currText").value = s.toString();
&/script&&
&div onmousemove="mousemove( event )" style="border:solid blue 1px"&&div&&/div&&div&&/div&&/div&&
&input type="text" value="" id="currText"/&&
经过测试，在上面选择文字时，下面的input框会自动填充选择的内容，这是不是你要的效果？
&!DOCTYPE HTML&&html&
&script src="/jquery-latest.js"&&/script&
&script type="text/javascript"&
$(document).ready(function() {
$(".alert").hover( function() {
alert($( this ).html());
);
});
&/script&
&body onclick="clicked(event)"&
&div style="border:solid blue 1px"&
&div class="alert"&&/div&
&div class="alert"&&/div&
&/div&
&input type="text" value="11111" id="currText"/&
&/body&
&/html&
统一给要点击的字符加个外标签，然后统一写个此标签的点击事件处理可否？
如下：
&label&0&/label&&label&1&/label&&label&2&/label&&label&3&/label&&label&4&/label&&label&5&/label&&label&6&/label&&label&7&/label&&label&8&/label&&label&9&/label&
$("label").click(function(){
& var txt = $(this).text();
& $("#currText").val(txt);
});
已解决问题
未解决问题推荐这篇日记的豆列
······& & &这个看似简单的获取坐标功能，可是已经花费我一天时间了，白天一直搜索js获取坐标，找了很多很多，一一检验，结果出现不兼容。真的够烦躁了，但是事情还是要继续，要完成，回来又继续实践，搜索，反复操作，发现自己好多不会呀，特别是jquery自定义方法（函数），根本就不会，很欠缺基础，心里暗暗下决心，弄完这个好好学习一下js,不然老是卡在这方面。时间虽然已经过去很久了，但我还是没有放弃，想想换个关键词搜索一下，是不是可以找到我想要的。搜索&js获取坐标兼容ie8&，一下子出现后几条，于是挑选一个实践,改造，功夫不负有心人，终于出现我想要的结果了。感谢网络，感谢网友，解决了困扰我一天的问题。贴出网上找到的代码。
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
&html xmlns="http://www.w3.org/1999/xhtml"&
&title&JavaScript获取鼠标移动时的坐标(兼容:IE8、谷歌、Firefox、Opera)_脚本之家&/title&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8" /&
&style type="text/css"&
width:<span style="background-color: #f5f5f5; color: #px;
border:2px solid #ddd;
padding:8px;
background:#f1f1f1;
color:#666;
&script type="text/javascript"&
function mousePos(e){
var e = e||window.
x:e.clientX+document.body.scrollLeft + document.documentElement.scrollLeft,
y:e.clientY+document.body.scrollTop + document.documentElement.scrollTop
//Firefox支持属性pageX,与pageY属性，这两个属性已经把页面滚动计算在内了,
//在Chrome可以通过document.body.scrollLeft，document.body.scrollTop计算出页面滚动位移，
//而在IE下可以通过document.documentElement.scrollLeft ，document.documentElement.scrollTop
function getMousePos(event) {
var e = event || window.
var scrollX = document.documentElement.scrollLeft || document.body.scrollL
var scrollY = document.documentElement.scrollTop || document.body.scrollT
var x = e.pageX || e.clientX + scrollX;
var y = e.pageY || e.clientY + scrollY;
//alert('x: ' + x + '\ny: ' + y);
return { 'x': x, 'y': y };
function test(e){
document.getElementById("mjs").innerHTML = getMousePos(e).x+','+getMousePos(e).y;
&div id="mjs" class="tip"&获取鼠标点击位置坐标&/div&
&div id="test" style="width:1000height:1000background:#" onmousemove="test(event)"&&/div&
我改造之后需要的代码
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
&html xmlns="http://www.w3.org/1999/xhtml"&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&title&7777777&/title&
&script src="/jquery-1.7.2.js"&&/script&
&script type="text/javascript"&
function mousePos(e){
var e = e||window.
x:e.clientX+document.body.scrollLeft + document.documentElement.scrollLeft,
y:e.clientY+document.body.scrollTop + document.documentElement.scrollTop
//Firefox支持属性pageX,与pageY属性，这两个属性已经把页面滚动计算在内了,
//在Chrome可以通过document.body.scrollLeft，document.body.scrollTop计算出页面滚动位移，
//而在IE下可以通过document.documentElement.scrollLeft ，document.documentElement.scrollTop
function getMousePos(event) {
var e = event || window.
var scrollX = document.documentElement.scrollLeft || document.body.scrollL
var scrollY = document.documentElement.scrollTop || document.body.scrollT
var x = e.pageX || e.clientX + scrollX;
var y = e.pageY || e.clientY + scrollY;
//alert('x: ' + x + '\ny: ' + y);
return { 'x': x, 'y': y };
function test(object,zhi,e){
//document.getElementById("mjs").innerHTML = getMousePos(e).x+','+getMousePos(e).y;
$("#mydiv1").css("top", getMousePos(e).y+10+"px").css("left", getMousePos(e).x+"px").css("display", "block");
$("#mydiv1").html(zhi);
function hides(object){
//document.getElementById("mjs").innerHTML = getMousePos(e).x+','+getMousePos(e).y;
$("#mydiv1").css("display", "none");
$("#mydiv1").html("");
&style type="text/css"&
width:<span style="background-color: #f5f5f5; color: #px;
border:2px solid #ddd;
padding:8px;
background:#f1f1f1;
color:#666;
&button&点击我&/button&
&div id="x"&我会变红的哦&/div&
&div id="mydiv1" style="position:display:border:1background:"&
&div id="mydiv2" style="position:display:border:1background:"&
&a id="t1" onMouseOver="test( this,'终于找到了',event)" onMouseOut="hides(this)"&鼠标放上去1&/a&
&br&&br&&br&&br&&br&
&a id="t2" onMouseOver="test(this,'ok',event)" onMouseOut="hides(this)"&鼠标放上去2&/a&
下面这个ie7,ie8不兼容,部分浏览器可以
&img&src="images/a.gif"&onclick="GetPosition(event)"&/&
function&GetPostion(e)&{&&var&x&=&getX(e);&&var&y&=&getY(e);}function&getX(e)&{&&e&=&e&||&window.&&&return&e.pageX&||&e.clientX&+&document.body.scroolL}function&getY(e)&{&&e&=&e||&window.&return&e.pageY&||&e.clientY&+&document.boyd.scrollT}
总结一下，信息检索真的很重要，就是要学会提问，搜索关键字。
部分转载于http://www.jb51.net/article/55128.htm
阅读(...) 评论()