javascript（基于jQuery）實(shí)現(xiàn)鼠標(biāo)獲取選中的文字示例【測(cè)試可用】
本文實(shí)例講述了javascript實(shí)現(xiàn)鼠標(biāo)獲取選中的文字。分享給大家供大家參考，具體如下：
HTML部分：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <body> <p>你好啊，那誰家的小誰。聽說你在找一個(gè)人。我知道她在哪里。</p> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> </body> </html>
1、獲取選中的文字：
document.selection.createRange().text; IE9以下使用
window.getSelection().toString(); 其他瀏覽器使用
$('p').mouseup(function(){
var txt = window.getSelection?window.getSelection():document.selection.createRange().text;
alert(txt) ;
})
完整demo示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<p>你好啊，那誰家的小誰。聽說你在找一個(gè)人。我知道她在哪里。</p>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
$('p').mouseup(function(){
var txt = window.getSelection?window.getSelection():document.selection.createRange().text;
alert(txt) ;
})
</script>
</body>
</html>
運(yùn)行效果：
2、取消處于選中狀態(tài)的文字：
document.selection.empty(); IE9以下使用
window.getSelection().removeAllRanges(); 其他瀏覽器使用
$('p').mouseup(function(){
window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
})
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery常見事件用法與技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》
希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。
- HTML+JS實(shí)現(xiàn)“代碼雨”效果源碼（黑客帝國(guó)文字下落效果）
- js實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊頁面彈出自定義文字效果
- JS實(shí)現(xiàn)排行榜文字向上滾動(dòng)輪播效果
- JS實(shí)現(xiàn)簡(jiǎn)單的文字無縫上下滾動(dòng)功能示例
- 解決Python下json.loads()中文字符出錯(cuò)的問題
- 圖片文字識(shí)別（OCR）插件Ocrad.js教程
- 原生JS實(shí)現(xiàn)旋轉(zhuǎn)輪播圖+文字內(nèi)容切換效果【附源碼】
- 基于js實(shí)現(xiàn)逐步顯示文字輸出代碼實(shí)例
相關(guān)文章
這篇文章主要介紹了jquery加載單文件vue組件的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
基于 jQuery 實(shí)現(xiàn)鍵盤事件監(jiān)聽控件
這篇文章主要介紹了基于 jQuery 的鍵盤事件監(jiān)聽控件,需要的朋友可以參考下2019-04-04
jQuery中圖片展示插件highslide.js的簡(jiǎn)單dom
Highslide是一個(gè)非常美觀的圖片燈箱插件，下面這篇文章主要給大家介紹了關(guān)于jQuery中圖片展示插件highslide.js的簡(jiǎn)單dom，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2018-04-04
本文主要介紹jquery仿ps顏色拾取功能的實(shí)例，具有很好的參考價(jià)值。下面跟著小編一起來看下吧2017-03-03
利用jQuery實(shí)現(xiàn)漂亮的圓形進(jìn)度條倒計(jì)時(shí)插件
jQuery Final Countdown是一款時(shí)尚的圓形進(jìn)度條樣式的jQuery倒計(jì)時(shí)插件。本篇文章給大家分享利用jQuery實(shí)現(xiàn)漂亮的圓形進(jìn)度條倒計(jì)時(shí)插件，感興趣的朋友一起看看吧2015-09-09
jquery focus(fn),blur(fn)方法實(shí)例代碼
jquery focus(fn),blur(fn)方法實(shí)例代碼，需要的朋友可以參考下。2011-12-12
jQuery實(shí)現(xiàn)簡(jiǎn)單登錄條件判斷
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)簡(jiǎn)單登錄條件判斷，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
基于jQuery實(shí)現(xiàn)以手風(fēng)琴方式展開和折疊導(dǎo)航菜單
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)以手風(fēng)琴方式展開和折疊導(dǎo)航菜單的相關(guān)資料,需要的朋友可以參考下2016-01-01
jquery easyUI中ajax異步校驗(yàn)用戶名
這篇文章主要為大家詳細(xì)介紹了jquery easyUI中ajax異步校驗(yàn)用戶名，感興趣的小伙伴們可以參考一下2016-08-08
Jquery 選中表格一列并對(duì)表格排序?qū)崿F(xiàn)原理
該實(shí)現(xiàn)的主要思想是：獲取鼠標(biāo)點(diǎn)擊的表頭單元格的列號(hào)，遍歷數(shù)據(jù)行，獲取每個(gè)<tr>中的html，同時(shí)獲取每個(gè)<tr>標(biāo)簽下對(duì)應(yīng)獲取到的列號(hào)的<td>標(biāo)簽中的內(nèi)容，并取得<th>標(biāo)簽的type屬性值，需要的朋友可以了解下2012-12-12