您的位置：农牧网资源中心 >> 网页特效 >> 综合特效 >> 阅读资讯：点击TextArea实现光标定位

点击TextArea实现光标定位

[ 来源：不详 | 作者：佚名 | 时间：2007-6-10 11:03:51 | 收藏本文 ]

<div id="NewsContentLabel" class="NewsContent">提示:1.点击代码可以查看效果.2.获取代码办法:建一个txt文本文件,然后把下面代码复制后贴到文本文件中.这样就可以得到纯净的代码!<html><head><meta http-equiv=Content-Type content=text/html; charset=gb2312><title>zgfree.com---网页特效---点击TextArea实现光标定位</title><style>INPUT{border: 1 solid #000000}BODY,TABLE{font-size: 10pt}</style></head><body><table border=0 width=700 cellspacing=0 cellpadding=0>  <tr>    <td width=479 rowspan=7>点击 TextArea 实现光标定位                                                                        <p>                                    <textarea rows=7 cols=49 id=box onclick=tellPoint()>我怕来不及我要抱着你，直到感觉你的绉纹有了岁月的痕迹，直到视线变得模糊直到不能呼吸为了你我愿意动也不能动也要看着你，直到感觉你的发线有了白雪的痕迹，直到肯定你是真的直到失去力气让我们形影不离如果全世界我也可以放弃，至少还有你值得我去珍惜而你在这里就是生命的奇迹也许全世界我也可以忘记，就是不愿意失去你的消息你掌心的痣我总记得在哪里我们好不容易我们身不由已，我怕时间太快不够将你看仔细，我怕时间太慢日夜担心失去你恨不得一夜之间白头永不分离</textarea>            <script>          function movePoint()     {      var pn = parseInt(pnum.value);                   if(isNaN(pn))       return;                   var rng = box.createTextRange();                rng.moveStart(character,pn);                   rng.collapse(true);                           rng.select();                   returnCase(rng)                           }          function tellPoint()     {      var rng = event.srcElement.createTextRange();       rng.moveToPoint(event.x,event.y);              rng.moveStart(character,-event.srcElement.value.length)                           pnum.value = rng.text.length                   returnCase(rng)     }               function returnCase(rng)     {      bh.innerText = rng.boundingHeight;      bl.innerText = rng.boundingLeft;      bt.innerText = rng.boundingTop;      bw.innerText = rng.boundingWidth;      ot.innerText = rng.offsetTop;      ol.innerText = rng.offsetLeft;      t.innerText  = rng.text;     }               function selectText(sp,ep)     {      sp = parseInt(sp)      ep = parseInt(ep)                   if(isNaN(sp)||isNaN(ep))       return;                    var rng = box.createTextRange();                   rng.moveEnd(character,-box.value.length)      rng.moveStart(character,-box.value.length)                   rng.collapse(true);                   rng.moveEnd(character,ep)      rng.moveStart(character,sp)                   rng.select();                   returnCase(rng);     }     var rg = box.createTextRange();     function findText(tw)     {      if(tw==)       return;                      var sw = 0;                   if(document.selection)      {       sw = document.selection.createRange().text.length;      }                           rg.moveEnd(character,box.value.length);                   rg.moveStart(character,sw);                     if(rg.findText(tw))              {       rg.select();   returnCase(rg);            }   if(rg.text!=tw) {  alert(已经搜索完了)  rg = box.createTextRange()        }              }          </script>                                  </p>                                    <p></p>                                    光标位置：<input type=text value=0 id=pnum size=8> <input type=button onclick=movePoint() value=移动光标到指定位置>                                 <p></p>                               选择指定范围：<input type=text size=9 id=sbox> -- <input type=text size=9 id=ebox> <input type=button onclick=selectText(sbox.value,ebox.value) value=选择>                                <p></p>                    选择查找字符 ：<input type=text value= id=cbox size=8> <input type=button onclick=findText(cbox.value) value=查找下一个并选择>                                                         </td>                                  <td width=217>boundingHeight: <span id=bh></span></td>                                </tr>                                <tr>                                  <td width=217>boundingWidth: <span id=bw></span></td>                                </tr>                                <tr>                                  <td width=217>boundingTop: <span id=bt></span></td>                                </tr>                                <tr>                                  <td width=217>boundingLeft: <span id=bl></span></td>                                </tr>                                <tr>                                  <td width=217>offsetLeft: <span id=ol></span> </td>                                </tr>                                <tr>                                  <td width=217>offsetTop: <span id=ot></span> </td>                                </tr>                                <tr>                                  <td width=217>text: <span style=position: absolute; z-index: 10 id=t></span> </td>                                </tr>                              </table>                              </body>                                                                        </html> </div><div id="Message" class="Message"></div>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

[] [返回上一页] [打印]