怎么获得鼠标选中的文字

hqs19821108 2010-01-21 08:42:23
在前台页面有一些文字，我用鼠标选中一些后，怎么能把这些文字自动放到<input type="text">里面呢

还有怎么通过js获得我选择的文字呢
...全文
898 17 打赏 收藏 转发到动态 举报
写回复
用AI写文章
17 条回复
切换为时间正序
请发表友善的回复…
发表回复
liu903993182 2012-05-17
  • 打赏
  • 举报
 回复
都东西学习了！
ganglong99 2010-01-21
  • 打赏
  • 举报
 回复
[Quote=引用 13 楼 hqs19821108 的回复:]
我想在前台页面双击鼠标就触发一个事件怎么写呢
[/Quote]


<SCRIPT LANGUAGE="JavaScript">

<!--

document.ondblclick = function() {

 alert("双击鼠标");

}

//-->

</SCRIPT>
ganglong99 2010-01-21
  • 打赏
  • 举报
 回复
document对象事件：

　　事件 描述
　　onactivate 当对象设置为活动元素时触发。
　　onbeforeactivate 对象要被设置为当前元素前立即触发。
　　onbeforecut 当选中区从文档中删除之前在源对象触发。
　　onbeforedeactivate 在 activeElement 从当前对象变为父文档其它对象之前立即触发。
　　onbeforeeditfocus 在包含于可编辑元素内的对象进入用户界面激活状态前或可编辑容器变成控件选中区前触发。
　　onbeforepaste 在选中区从系统剪贴板粘贴到文档前在目标对象上触发。
　　onclick 在用户用鼠标左键单击对象时触发。
　　oncontextmenu 在用户使用鼠标右键单击客户区打开上下文菜单时触发。
　　oncontrolselect 当用户将要对该对象制作一个控件选中区时触发。
　　oncut 当对象或选中区从文档中删除并添加到系统剪贴板上时在源元素上触发。
　　ondblclick 当用户双击对象时触发。
　　ondeactivate 当 activeElement 从当前对象变为父文档其它对象时触发。
　　ondrag 当进行拖曳操作时在源对象上持续触发。
　　ondragend 当用户在拖曳操作结束后释放鼠标时在源对象上触发。
　　ondragenter 当用户拖曳对象到一个合法拖曳目标时在目标元素上触发。
　　ondragleave 当用户在拖曳操作过程中将鼠标移出合法拖曳目标时在目标对象上触发。
　　ondragover 当用户拖曳对象划过合法拖曳目标时持续在目标元素上触发。
　　ondragstart 当用户开始拖曳文本选中区或选中对象时在源对象上触发。
　　ondrop 当鼠标按钮在拖曳操作过程中释放时在目标对象上触发。
　　onfocusin 当元素将要被设置为焦点之前触发。
　　onfocusout 在移动焦点到其它元素之后立即触发于当前拥有焦点的元素上触发。
　　onhelp 当用户在浏览器为当前窗口时按 F1 键时触发。
　　onkeydown 当用户按下键盘按键时触发。
　　onkeypress 当用户按下字面键时触发。
　　onkeyup 当用户释放键盘按键时触发。
　　onmousedown 当用户用任何鼠标按钮单击对象时触发。
　　onmousemove 当用户将鼠标划过对象时触发。
　　onmouseout 当用户将鼠标指针移出对象边界时触发。
　　onmouseover 当用户将鼠标指针移动到对象内时触发。
　　onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发。
　　onmousewheel 当鼠标滚轮按钮旋转时触发。
　　onmove 当对象移动时触发。
　　onmoveend 当对象停止移动时触发。
　　onmovestart 当对象开始移动时触发。
　　onpaste 当用户粘贴数据以便从系统剪贴板向文档传送数据时在目标对象上触发。
　　onpropertychange 当在对象上发生对象上发生属性更改时触发。
　　onreadystatechange 当对象状态变更时触发。
　　onresizeend 当用户更改完控件选中区中对象的尺寸时触发。
　　onresizestart 当用户开始更改控件选中区中对象的尺寸时触发。
　　onselectionchange 当文档的选中状态改变时触发。
　　onstop 当用户单击停止按钮或离开 Web 页面时触发。
zhoutaibo 2010-01-21
  • 打赏
  • 举报
 回复
js中有一个事件是专门实现你要的功能的，你相相JS事件大全就知道了
ganglong99 2010-01-21
  • 打赏
  • 举报
 回复
实际上用不着那么复杂，这样就可以了


<!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">



<head>

<meta content="text/html; charset=gb2312" http-equiv="Content-Type" />

<title>无标题 1</title>

</head>



<body>

<div style=" font-size:20px">

我需要在页面中增加一个js代码，当用户用鼠标选择文字（鼠标拖动涂蓝文字）时，会出现一个层，提示与这个选择文字有个的信息

</div>

<INPUT TYPE="text" NAME="" value="nihao">

<br/><br/><br/><br/><br/><br/><br/><br/><br/>

<div id="show"></div>

</body>

<script type="text/javascript">

    //这个我就不说了……

    function $(id)

    {

        return document.getElementById(id);

    }

    //当选区改变时，改变选区的属性

    document.onselectionchange=function(){

        $("show").innerHTML=document.selection.createRange().text;

    }; 

	document.onmouseup = function() {

		$("show").innerHTML=document.selection.createRange().text;

	}

</script>



</html>
Joke_yu 2010-01-21
  • 打赏
  • 举报
 回复
学习
ganglong99 2010-01-21
  • 打赏
  • 举报
 回复
楼上的当双击鼠标选中文字时，获取不到
jol_boy 2010-01-21
  • 打赏
  • 举报
 回复 


<!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">



<head>

<meta content="text/html; charset=gb2312" http-equiv="Content-Type" />

<title>无标题 1</title>

</head>



<body>

<div style=" font-size:20px">

我需要在页面中增加一个js代码，当用户用鼠标选择文字（鼠标拖动涂蓝文字）时，会出现一个层，提示与这个选择文字有个的信息

</div>

<br/><br/><br/><br/><br/><br/><br/><br/><br/>

<div id="show"></div>

</body>

<script type="text/javascript">

    //记录选区大小，位置

    var rect = {

        left:-1,

        top:-1,

        width:-1,

        height:-1,

        start_left:-1

    };

    //这个我就不说了……

    function $(id)

    {

        return document.getElementById(id);

    }

    //当选区改变时，改变选区的属性

    document.onselectionchange=function(){

        var sel = document.selection.createRange();

        rect.left = sel.boundingLeft;

        rect.top = sel.boundingTop;

        rect.width = sel.boundingWidth;

        rect.height = sel.boundingHeight;

        rect.start_left = sel.offsetLeft;

        rect.end_left = sel.offsetTop;

    };

    //当鼠标移动时，得到鼠标的绝对位置

    document.onmousemove = function(){

        var position = getMouse(window.event);

        if(ptInRect(rect,position))

        {

             document.title = "鼠标在选区中！！！！！！！！！！！";

             $("show").innerHTML="选择的文字是--->"+document.selection.createRange().text;

        }

        else

            document.title = "鼠标不在选区中";

      

    }

    //判断鼠标是否在矩形（也就是选区，选区是一个矩形）内

    function ptInRect(rect,pt)

    {

        if(pt.x>rect.left&&pt.x<rect.left+rect.width&&pt.x>rect.start_left)

            if(pt.y>rect.top&&pt.y<rect.top+rect.height)

                return true;

        return false;

    }

    //得到鼠标的位置

    function getMouse(ev)

    {

         if(ev.pageX || ev.pageY)

         {         

              return {x:ev.pageX, y:ev.pageY};

         }

         return {         

              x:ev.clientX + document.body.scrollLeft - document.body.clientLeft, 

              y:ev.clientY + document.body.scrollTop  - document.body.clientTop     

         }; 

    } 

</script>



</html>
真哥哥 2010-01-21
  • 打赏
  • 举报
 回复
<script>
function Test() {

try {
var selecter = window.getSelection();

if (selecter != null) {
alert(selecter);
}
} catch (err) {
var selecter = document.selection.createRange();
var s = selecter.text;
if (s != null && s.trim() != "") {
alert(s)
}
}
}

String.prototype.trim = function() {
return this.replace(/(^\s*)|(\s*$)/g, "");
}
</script>
curacfyh 2010-01-21
  • 打赏
  • 举报
 回复
文本框有onSelect事件，其他的标签如DIV我试了下没发现。
我想你可以模拟，你可以监听onmouseup事件，然后用3楼哥们的代码，可以判断下，selection是否有文本。有文本就赋值给你的input。
qq373591361 2010-01-21
  • 打赏
  • 举报
 回复
应该有个事件吧，我基础比较差，麻烦说得详细一点
王集鹄 2010-01-21
  • 打赏
  • 举报
 回复 
function getSelectionText(doc) {

	if (!doc) doc = document;

	var q;

	try {

		if (doc.parentWindow && doc.parentWindow.getSelection) q = doc.parentWindow.getSelection();

		else if (doc.getSelection) q = doc.getSelection();

		else if (doc.selection) q = doc.selection.createRange().text;

	} catch(e) {}



	if (!q) {

		var iframes = doc.getElementsByTagName("iframe");

		for (var i = 0; i < iframes.length; i++) {

			try {

				q = this.getSelectionText(iframes[i].contentWindow.document);

			} catch(e) {}

			if (q) return q;

		}

	}

	return q;

}
wangliang3984337123 2010-01-21
  • 打赏
  • 举报
 回复
？？？？？？？没明白！
孟子E章 2010-01-21
  • 打赏
  • 举报
 回复
参考createRange()的使用方法
a183249556 2010-01-21
  • 打赏
  • 举报
 回复
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body onmouseup="showSeletedLink()">
http://www.baidu.com
<script language="javascript" type="text/javascript">

function showSeletedLink()
{
alert(document.selection.createRange().text);

}
</script>
</body>
</html>
vue+element+input+提取选中文字
textarea中有大量数据，获得鼠标选中的部分数据
jQuery实现鼠标选文字发新浪微博的方法
原理很简单，先获得鼠标选中文字，然后调用新浪博客中提供的页面，把文字作为参数传过去就OK了。 代码如下： <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></...
web自动化-Frame表单&鼠标操作
本课程主要讲解web自动化中frame表单与鼠标的操作,主要内容如下: 1. frame表单介绍 2. frame表单切换 3. 表单切换案例 4. 鼠标操作 5. 鼠标操作案例
CSS改变网页中鼠标选中文字背景颜色例子
CSS的作用就是用来美化网页的内容或者结构层次。这我们都知道，不是吗？随着CSS技术的不断革新升级，我们获得了更多的控制样式的能力
【JavaScript源代码】JavaScript onblur与onfocus事件详解.docx
JavaScript onblur与onfocus事件详解 　html页面中，诸如按钮、文本框等可视元素...　以下的文本框，当鼠标指针移过去时，里面的文字全部被选中：　请输入网址　这是怎么做的呢？看以下代码及解释：　<input type="tex
JavaScript

87,907

社区成员

224,614

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章