免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

打開APP
userphoto
未登錄

開通VIP，暢享免費電子書等14項超值服

開通VIP

首頁

好書

留言交流

下載APP

聯(lián)系客服
document.selection 的作用：獲取選中然后進行相關操作
轉：http://qingfeng825.iteye.com/blog/259099 


一、document.selection 介紹 

document.selection 表示當前網(wǎng)頁中的選中內容。 

方法有： 

    clear　清除選中的內容 
    empty　取消選中 
    createRange　返回 TextRange 或 ControlRange 對象 
    createRangeCollection 不支持 

屬性有： 



    type　選中內容的類型 
    typeDetail 不支持 



二、document.selection.createRange()詳細介紹 

     document.selection.createRange() 根據(jù)當前文字選擇返回 TextRange 對象，或根據(jù)控件選擇返回ControlRange 對象。 

配合 execCommand，在 HTML 編輯器中很有用，比如：文字加粗、斜體、復制、粘貼、創(chuàng)建超鏈接等。 



例子： 
Html代碼  收藏代碼   
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
  2.     <html xmlns="http://www.w3.org/1999/xhtml" >    
  3.     <head>    
  4.         <title>document.selection 的 createRange</title>    
  5.     </head>    
  6.     <body>    
  7.         
  8.       <div>請選中這里的部分文字。</div>    
  9.       <div><input type="button" value="加粗" onclick="javascript:Bold();" /></div>    
  10.     <script type="text/javascript" language="javascript">    
  11.     <!--    
  12.     function Bold()    
  13.     {    
  14.         var r = document.selection.createRange();    
  15.         r.execCommand("Bold");    
  16.     }    
  17.     -->    
  18.     </script>    
  19.         
  20.     </body>    
  21.     </html>    


三、光標定位的例 
Html代碼  收藏代碼   
  1. <pre name="code" class="html"> <html>     
  2.     <head>     
  3.     <meta http-equiv="Content-Type" content="text/html; charset=gb2312">     
  4.     <meta name="GENERATOR" content="Microsoft FrontPage 4.0">     
  5.     <meta name="ProgId" content="FrontPage.Editor.Document">     
  6.     <title>光標位置</title>     
  7.     <style>     
  8.     INPUT{border: 1 solid #000000}     
  9.     BODY,TABLE{font-size: 10pt}     
  10.     </style>     
  11.     </head>     
  12.     <body>     
  13.     <table border="0" width="700" cellspacing="0" cellpadding="0">     
  14.       <tr>     
  15.         <td width="479" rowspan="7">     
  16.     點擊 TextArea 實現(xiàn)光標定位             
  17.                  
  18.     <textarea rows="7" cols="49" id="box" onclick=tellPoint()>我怕來不及我要抱著你，直到感覺你的縐紋有了歲月的痕跡，直到視線變得模糊直到不能呼吸     
  19.     為了你我愿意     
  20.     動也不能動也要看著你，直到感覺你的發(fā)線有了白雪的痕跡，直到肯定你是真的直到失去力氣讓我們形影不離     
  21.     如果全世界我也可以放棄，至少還有你值得我去珍惜而你在這里就是生命的奇跡     
  22.     也許全世界我也可以忘記，就是不愿意失去你的消息你掌心的痣我總記得在哪里     
  23.     我們好不容易我們身不由已，我怕時間太快不夠將你看仔細，我怕時間太慢日夜擔心失去你恨不得一夜之間白頭永不分離     
  24.     </textarea>            
  25.     <script language="javascript">     
  26.     function movePoint()          
  27.     {          
  28.      var pn = parseInt(pnum.value);          
  29.      if(isNaN(pn))          
  30.       return;          
  31.      var rng = box.createTextRange();      
  32.      rng.moveStart("character",pn);          
  33.      rng.collapse(true);           
  34.      rng.select();          
  35.      returnCase(rng)           
  36.     }          
  37.     function tellPoint()          
  38.     {          
  39.      var rng = event.srcElement.createTextRange();      
  40.      rng.moveToPoint(event.x,event.y);           
  41.      rng.moveStart("character",-event.srcElement.value.length)           
  42.      pnum.value = rng.text.length          
  43.      returnCase(rng)          
  44.     }          
  45.               
  46.     function returnCase(rng)          
  47.     {          
  48.      bh.innerText = rng.boundingHeight;          
  49.      bl.innerText = rng.boundingLeft;          
  50.      bt.innerText = rng.boundingTop;          
  51.      bw.innerText = rng.boundingWidth;          
  52.      ot.innerText = rng.offsetTop;          
  53.      ol.innerText = rng.offsetLeft;          
  54.      t.innerText  = rng.text;          
  55.     }          
  56.               
  57.     function selectText(sp,ep)          
  58.     {          
  59.      sp = parseInt(sp)          
  60.      ep = parseInt(ep)          
  61.      if(isNaN(sp)||isNaN(ep))          
  62.       return;          
  63.      var rng = box.createTextRange();          
  64.      rng.moveEnd("character",-box.value.length)          
  65.      rng.moveStart("character",-box.value.length)          
  66.      rng.collapse(true);          
  67.      rng.moveEnd("character",ep)          
  68.      rng.moveStart("character",sp)          
  69.      rng.select();          
  70.      returnCase(rng);          
  71.     }          
  72.     var rg = box.createTextRange();     
  73.     function findText(tw)          
  74.     {          
  75.      if(tw=="")          
  76.       return;      
  77.      var sw = 0;          
  78.      if(document.selection)          
  79.      {          
  80.       sw = document.selection.createRange().text.length;          
  81.      }           
  82.      rg.moveEnd("character",box.value.length);          
  83.      rg.moveStart("character",sw);          
  84.      if(rg.findText(tw))           
  85.      {          
  86.       rg.select();      
  87.       returnCase(rg);         
  88.      }      
  89.           
  90.      if(rg.text!=tw)     
  91.      {     
  92.       alert("已經(jīng)搜索完了")     
  93.       rg = box.createTextRange()     
  94.      }     
  95.                 
  96.     }          
  97.               
  98.     </script>           
  99.                  
  100.   
  101.   
  102.                  
  103.     光標位置：<input type="text" value="0" id="pnum" size="8"> <input type="button" onclick="movePoint()" value="移動光標到指定位置">          
  104.                    
  105.     選擇指定范圍：<input type="text" size="9" id="sbox"> -- <input type="text" size="9" id="ebox"> <input type="button" onclick="selectText(sbox.value,ebox.value)" value="選擇">         
  106.                
  107.     選擇查找字符 ：<input type="text" value="" id="cbox" size="8"> <input type="button" onclick="findText(cbox.value)" value="查找下一個并選擇">          
  108.                
  109.         </td>              
  110.         <td width="217">boundingHeight: <span id="bh"></span></td>              
  111.       </tr>              
  112.       <tr>              
  113.         <td width="217">boundingWidth: <span id="bw"></span></td>              
  114.       </tr>              
  115.       <tr>              
  116.         <td width="217">boundingTop: <span id="bt"></span></td>              
  117.       </tr>              
  118.       <tr>              
  119.         <td width="217">boundingLeft: <span id="bl"></span></td>              
  120.       </tr>              
  121.       <tr>              
  122.         <td width="217">offsetLeft: <span id="ol"></span> </td>              
  123.       </tr>              
  124.       <tr>              
  125.         <td width="217">offsetTop: <span id="ot"></span> </td>              
  126.       </tr>              
  127.       <tr>              
  128.         <td width="217">text: <span style="position: absolute; z-index: 10" id="t"></span> </td>              
  129.       </tr>              
  130.     </table>              
  131.     </body>             
  132.                  
  133.     </html>  </pre><br>  
  134. <br>  
  135. <pre></pre>  
  136. <br style="font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:14px; line-height:25px; text-align:left">  
  137. <br style="font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:14px; line-height:25px; text-align:left">  
  138. <br style="font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:14px; line-height:25px; text-align:left">  
  139. <span style="font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:14px; line-height:25px; text-align:left">四、項目中用到的光標定位 </span><br style="font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:14px; line-height:25px; text-align:left">  
  140. <span style="font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:14px; line-height:25px; text-align:left">Js代碼  收藏代碼 </span><span style="font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:14px; line-height:25px; text-align:left">     </span><pre name="code" class="html">   //obj：要設置的對象   num：把光標設在那個位置    
  141.      function   setFocus(obj,num)       
  142.       {       
  143.             var   rng=obj.createTextRange();       
  144.             rng.moveStart("character",   num);       
  145.             rng.collapse(true);       
  146.             rng.select();       
  147.       }     
  148.     //改變當前頁面的焦點    
  149.     function  updateCurrentPageFocus(){    
  150.         //如果是合訂書名    
  151.         var obj;    
  152.         <c:if test="${indexingBean.isBound==0}">    
  153.                 obj=document.indexform.firstBookName;    
  154.         </c:if>    
  155.         <c:if test="${indexingBean.isBound==1}">    
  156.                 obj=document.indexform.boundBookName;    
  157.         </c:if>    
  158.           if(StringUtils.isBlank(obj.value)){    
  159.               setFocus(obj,0);    
  160.             }else{    
  161.                   setFocus(obj,obj.value.length);    
  162.                 }    
  163.         } </pre><br>  
  164.      
本站僅提供存儲服務，所有內容均由用戶發(fā)布，如發(fā)現(xiàn)有害或侵權內容，請點擊舉報。
打開APP，閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
詳探TextRange對象--用execCommand()執(zhí)行命令
javascript 光標定位
博客園 - 小橋 - 在線HTML編輯器原理
JS動態(tài)添加div，然后在div中添加元素
關于document.selection對象的介紹 - 寒云路幾層的日志 - 網(wǎng)易博客
html5加js實現(xiàn)本地文件讀取和寫入并獲取本地文件路徑
更多類似文章 >>
生活服務
分享 收藏 導長圖 關注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權！
如果VIP功能使用有故障，
可點擊這里聯(lián)系客服！

聯(lián)系客服