﻿<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/"><channel><title>BlogJava-自大的人只想着怎么把面子保住，自强的人只想着怎么把事办好！-文章分类-JS</title><link>http://www.blogjava.net/mlzry0612/category/50261.html</link><description>自大的人只想着怎么把面子保住，自强的人只想着怎么把事办好！</description><language>zh-cn</language><lastBuildDate>Thu, 01 Dec 2011 16:14:22 GMT</lastBuildDate><pubDate>Thu, 01 Dec 2011 16:14:22 GMT</pubDate><ttl>60</ttl><item><title>Text Area item 上下移</title><link>http://www.blogjava.net/mlzry0612/articles/365336.html</link><dc:creator>Daniel</dc:creator><author>Daniel</author><pubDate>Thu, 01 Dec 2011 15:03:00 GMT</pubDate><guid>http://www.blogjava.net/mlzry0612/articles/365336.html</guid><wfw:comment>http://www.blogjava.net/mlzry0612/comments/365336.html</wfw:comment><comments>http://www.blogjava.net/mlzry0612/articles/365336.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/mlzry0612/comments/commentRss/365336.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/mlzry0612/services/trackbacks/365336.html</trackback:ping><description><![CDATA[<div><div>&lt;html&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;head&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;meta http-equiv="Content-Type" content="text/html; charset=gb2312"&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;meta name="GENERATOR" content="Microsoft FrontPage 4.0"&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;meta name="ProgId" content="FrontPage.Editor.Document"&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;title&gt;光标位置&lt;/title&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;style&gt; &nbsp;&nbsp;</div><div>&nbsp; INPUT{border: 1 solid #000000} &nbsp;&nbsp;</div><div>&nbsp; BODY,TABLE{font-size: 10pt} &nbsp;&nbsp;</div><div>&nbsp; &lt;/style&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/head&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;body&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;table border="0" width="700" cellspacing="0" cellpadding="0"&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;td width="479" rowspan="17"&gt; &nbsp;&nbsp;</div><div>&nbsp; 点击 TextArea 实现光标定位 &nbsp;&nbsp;</div><div>&nbsp; &lt;p&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;input type="Button" value="ff" onclick="fo()"/&gt;</div><div>&nbsp; &lt;input type="Button" value="UPLINE" onclick="upLine()"/&gt;</div><div>&nbsp; &lt;input type="Button" value="DOWNLINE" onclick="downLine()"/&gt;</div><div>&nbsp; &lt;textarea rows="17" cols="49" id="box" onclick="tellPoint()" &gt;</div><div>HIGHHEEL</div><div>sfsfsfs</div><div>s1123</div><div>432434</div><div>asf</div><div>fsa</div><div>sf</div><div>3232&lt;/textarea&gt;&nbsp;</div><div>&nbsp; &lt;script type="text/javascript"&gt;</div><div><span style="white-space:pre">		</span> &nbsp; function getPos(textarea) {</div><div><span style="white-space:pre">		</span> &nbsp; var rangeData = {text: "", start: 0, end: 0 };</div><div><span style="white-space:pre">		</span> &nbsp;</div><div><span style="white-space:pre">		</span> &nbsp; if (textarea.setSelectionRange) { // W3C&nbsp;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;textarea.focus();</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;rangeData.start= textarea.selectionStart;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;rangeData.end = textarea.selectionEnd;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;rangeData.text = (rangeData.start != rangeData.end) ? textarea.value.substring(rangeData.start, rangeData.end): "";</div><div><span style="white-space:pre">		</span> &nbsp; } else if (document.selection) { // IE</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;textarea.focus();</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;var i,</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp; oS = document.selection.createRange(),</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp; // Don't: oR = textarea.createTextRange()</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp; oR = document.body.createTextRange();</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;oR.moveToElementText(textarea);</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;rangeData.text = oS.text;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;rangeData.bookmark = oS.getBookmark();</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;// object.moveStart(sUnit [, iCount])&nbsp;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;// Return Value: Integer that returns the number of units moved.</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;for (i = 0; oR.compareEndPoints('StartToStart', oS) &lt; 0 &amp;&amp; oS.moveStart("character", -1) !== 0; i ++) {</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp; // Why? You can alert(textarea.value.length)</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp; if (textarea.value.charAt(i) == '/r' ) {</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp; &nbsp;i ++;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp; }</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;}</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;rangeData.start = i;</div><div><span style="white-space:pre">		</span> &nbsp; &nbsp;rangeData.end = rangeData.text.length + rangeData.start;</div><div><span style="white-space:pre">		</span> &nbsp; }</div><div><span style="white-space:pre">		</span> &nbsp;&nbsp;</div><div><span style="white-space:pre">		</span> &nbsp; return rangeData;</div><div><span style="white-space:pre">		</span> &nbsp; }</div><div></div><div>&nbsp;&nbsp;</div><div>&nbsp; function fo(){</div><div><span style="white-space:pre">	</span> &nbsp;var text = new String(document.getElementById("box").value);</div><div><span style="white-space:pre">	</span> &nbsp;var currentCurrosr = document.getElementById("pnum").value;</div><div><span style="white-space:pre">	</span> &nbsp;alert(text.substring(currentCurrosr-1, currentCurrosr));</div><div><span style="white-space:pre">	</span> &nbsp;pos = getPos(document.getElementById("box"));</div><div><span style="white-space:pre">	</span> &nbsp;alert(pos.start);</div><div>// &nbsp; &nbsp; &nbsp; var end = text.indexOf("\r\n", document.getElementById("pnum").value);</div><div>// &nbsp; &nbsp; &nbsp;if(end == -1){</div><div>// &nbsp; &nbsp; <span style="white-space:pre">	</span> alert("END");</div><div>// &nbsp; &nbsp; &nbsp;}</div><div>// &nbsp; &nbsp; var start = text.lastIndexOf("\r\n", currentCurrosr);</div><div>// &nbsp; &nbsp; if(start == -1){alert("START");}</div><div>// &nbsp; &nbsp; var currentLine = getLine(currentCurrosr);</div><div>// &nbsp; &nbsp; alert("CUL"+currentLine+"L"+currentLine.length);</div><div>// &nbsp; &nbsp; var nextLine = getLine(end + 1);</div><div>// &nbsp; &nbsp; alert("NEXT"+nextLine+"L"+nextLine.length);</div><div>// &nbsp; &nbsp; var preLine = getLine(start - 1);</div><div>// &nbsp; &nbsp; alert("PRE"+ preLine+"L"+preLine.length);</div><div>&nbsp; }</div><div>&nbsp;&nbsp;</div><div>&nbsp; function upLine(){</div><div><span style="white-space:pre">	</span> &nbsp;var text = new String(document.getElementById("box").value);</div><div><span style="white-space:pre">	</span> &nbsp;var currentCurrosr = document.getElementById("h1").value;</div><div>&nbsp; &nbsp; &nbsp; var end = text.indexOf("\r\n",currentCurrosr);</div><div>&nbsp; &nbsp; &nbsp; var start = null;</div><div>&nbsp; &nbsp; &nbsp; if(currentCurrosr == end){</div><div><span style="white-space:pre">		</span>start =text.lastIndexOf("\r\n", currentCurrosr-1); &nbsp;</div><div>&nbsp; &nbsp; &nbsp; }else{</div><div>&nbsp; &nbsp;<span style="white-space:pre">	</span> &nbsp; <span style="white-space:pre">	</span>start = text.lastIndexOf("\r\n", currentCurrosr);</div><div>&nbsp; &nbsp; &nbsp; }</div><div>&nbsp; &nbsp; &nbsp; if(start == -1){alert("Already the toppest!");</div><div>&nbsp; &nbsp; &nbsp; return;</div><div>&nbsp; &nbsp; &nbsp; }</div><div>&nbsp; &nbsp; &nbsp; var preLine = getLine(start-1);</div><div>&nbsp; &nbsp; &nbsp; var currentLine = getLine(currentCurrosr);</div><div>&nbsp; &nbsp; &nbsp; var preLineStart = text.lastIndexOf("\r\n", start-1);</div><div>&nbsp; &nbsp; &nbsp; var sq = null;</div><div>&nbsp; &nbsp; &nbsp; var endPart = text.substring(end,text.length);</div><div>&nbsp; &nbsp; <span style="white-space:pre">	</span>alert(text.length);</div><div>&nbsp; &nbsp; &nbsp; if(preLineStart == -1){</div><div>&nbsp; &nbsp; <span style="white-space:pre">	</span>sq = new String(currentLine).substring(2, currentLine.length).concat("\r\n").concat(preLine).concat(endPart);</div><div>&nbsp; &nbsp; <span style="white-space:pre">	</span>alert(sq);</div><div>&nbsp; &nbsp; <span style="white-space:pre">	</span>alert(sq.length);</div><div>&nbsp; &nbsp; &nbsp; }else{</div><div>&nbsp; &nbsp; <span style="white-space:pre">	</span> &nbsp;alert(preLineStart);</div><div><span style="white-space:pre">	</span> &nbsp; &nbsp; &nbsp;sq = text.substring(0, preLineStart).concat(currentLine).concat(preLine).concat(endPart);</div><div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert(sq);</div><div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert(sq.length);</div><div>&nbsp; &nbsp; &nbsp; }</div><div>&nbsp; &nbsp; &nbsp; document.getElementById("box").value=sq;</div><div>&nbsp; }</div><div>&nbsp;&nbsp;</div><div>&nbsp; function downLine(){</div><div><span style="white-space:pre">	</span> &nbsp;</div><div>&nbsp; }</div><div>&nbsp;&nbsp;</div><div>&nbsp; &nbsp;</div><div>&nbsp;&nbsp;</div><div>&nbsp;&nbsp;</div><div>&nbsp; function getLine(currsor){</div><div><span style="white-space:pre">		</span>var text = new String(document.getElementById("box").value);</div><div><span style="white-space:pre">		</span>var end = text.indexOf("\r\n", currsor);</div><div><span style="white-space:pre">		</span>if(end == -1){</div><div><span style="white-space:pre">			</span>return text.substring(text.lastIndexOf("\r\n", text.length), text.length);</div><div><span style="white-space:pre">		</span>}</div><div><span style="white-space:pre">		</span>var tmp = text.substring(0, end);</div><div><span style="white-space:pre">		</span>var start = tmp.lastIndexOf("\r\n", end);</div><div><span style="white-space:pre">		</span>if(start == -1){</div><div><span style="white-space:pre">		</span>}</div><div><span style="white-space:pre">		</span></div><div>// <span style="white-space:pre">		</span>alert(tmp);</div><div>// <span style="white-space:pre">		</span>alert(start);</div><div>// <span style="white-space:pre">			</span>alert(text.substring(start+4, end).length);</div><div>// <span style="white-space:pre">			</span>alert(text.substring(start+4, end));<span style="white-space:pre">	</span></div><div><span style="white-space:pre">			</span>return text.substring(start, end);</div><div><span style="white-space:pre">	</span>}</div><div>&nbsp; function movePoint() &nbsp;&nbsp;</div><div>&nbsp; { &nbsp;&nbsp;</div><div>&nbsp; var pn=parseInt(pnum.value); &nbsp;&nbsp;</div><div>&nbsp; if(isNaN(pn)) &nbsp;&nbsp;</div><div>&nbsp; return; &nbsp;&nbsp;</div><div>&nbsp; var rng=box.createTextRange(); &nbsp;&nbsp;</div><div>&nbsp; rng.moveStart("character",pn); &nbsp;&nbsp;</div><div>&nbsp; rng.collapse(true); &nbsp;&nbsp;</div><div>&nbsp; rng.select(); &nbsp;&nbsp;</div><div>&nbsp; returnCase(rng) &nbsp;&nbsp;</div><div>&nbsp; } &nbsp;&nbsp;</div><div>&nbsp; function tellPoint() &nbsp;&nbsp;</div><div>&nbsp; {&nbsp;</div><div>&nbsp; var rng=event.srcElement.createTextRange(); &nbsp;&nbsp;</div><div>&nbsp; rng.moveToPoint(event.x,event.y); &nbsp;&nbsp;</div><div>&nbsp; rng.moveStart("character",-event.srcElement.value.length) &nbsp;&nbsp;</div><div>&nbsp; h1.value=rng.text.length;&nbsp;</div><div>&nbsp; pnum.value=rng.text.length;</div><div>&nbsp; returnCase(rng) &nbsp;&nbsp;</div><div>&nbsp; } &nbsp;&nbsp;</div><div>&nbsp; &nbsp;</div><div>&nbsp; function returnCase(rng) &nbsp;&nbsp;</div><div>&nbsp; { &nbsp;&nbsp;</div><div>&nbsp; bh.innerText=rng.boundingHeight; &nbsp;&nbsp;</div><div>&nbsp; bl.innerText=rng.boundingLeft; &nbsp;&nbsp;</div><div>&nbsp; bt.innerText=rng.boundingTop; &nbsp;&nbsp;</div><div>&nbsp; bw.innerText=rng.boundingWidth; &nbsp;&nbsp;</div><div>&nbsp; ot.innerText=rng.offsetTop; &nbsp;&nbsp;</div><div>&nbsp; ol.innerText=rng.offsetLeft; &nbsp;&nbsp;</div><div>&nbsp; t.innerText=rng.text; &nbsp;&nbsp;</div><div>&nbsp; } &nbsp;&nbsp;</div><div>&nbsp; &nbsp;</div><div>&nbsp; function selectText(sp,ep) &nbsp;&nbsp;</div><div>&nbsp; { &nbsp;&nbsp;</div><div>&nbsp; sp=parseInt(sp) &nbsp;&nbsp;</div><div>&nbsp; ep=parseInt(ep) &nbsp;&nbsp;</div><div>&nbsp; if(isNaN(sp)||isNaN(ep)) &nbsp;&nbsp;</div><div>&nbsp; return; &nbsp;&nbsp;</div><div>&nbsp; var rng=box.createTextRange(); &nbsp;&nbsp;</div><div>&nbsp; rng.moveEnd("character",-box.value.length) &nbsp;&nbsp;</div><div>&nbsp; rng.moveStart("character",-box.value.length) &nbsp;&nbsp;</div><div>&nbsp; rng.collapse(true); &nbsp;&nbsp;</div><div>&nbsp; rng.moveEnd("character",ep) &nbsp;&nbsp;</div><div>&nbsp; rng.moveStart("character",sp) &nbsp;&nbsp;</div><div>&nbsp; rng.select(); &nbsp;&nbsp;</div><div>&nbsp; returnCase(rng); &nbsp;&nbsp;</div><div>&nbsp; } &nbsp;&nbsp;</div><div>&nbsp; var rg=box.createTextRange(); &nbsp;&nbsp;</div><div>&nbsp; function findText(tw) &nbsp;&nbsp;</div><div>&nbsp; { &nbsp;&nbsp;</div><div>&nbsp; if(tw=="") &nbsp;&nbsp;</div><div>&nbsp; return; &nbsp;&nbsp;</div><div>&nbsp; var sw=0; &nbsp;&nbsp;</div><div>&nbsp; if(document.selection) &nbsp;&nbsp;</div><div>&nbsp; { &nbsp;&nbsp;</div><div>&nbsp; sw=document.selection.createRange().text.length; &nbsp;&nbsp;</div><div>&nbsp; } &nbsp;&nbsp;</div><div>&nbsp; rg.moveEnd("character",box.value.length); &nbsp;&nbsp;</div><div>&nbsp; rg.moveStart("character",sw); &nbsp;&nbsp;</div><div>&nbsp; &nbsp;</div><div>&nbsp; if(rg.findText(tw)) &nbsp;&nbsp;</div><div>&nbsp; { &nbsp;&nbsp;</div><div>&nbsp; rg.select(); &nbsp;&nbsp;</div><div>&nbsp; returnCase(rg); &nbsp;&nbsp;</div><div>&nbsp; } &nbsp;&nbsp;</div><div>&nbsp; if(rg.text!=tw) &nbsp;&nbsp;</div><div>&nbsp; { &nbsp;&nbsp;</div><div>&nbsp; alert("已经搜索完了"); &nbsp;&nbsp;</div><div>&nbsp; rg=box.createTextRange(); &nbsp;&nbsp;</div><div>&nbsp; } &nbsp;&nbsp;</div><div>&nbsp; } &nbsp;&nbsp;</div><div>&nbsp; &lt;/script&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/p&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;p&gt;&lt;/p&gt;</div><div>&nbsp;&nbsp;</div><div>&nbsp; &lt;input type="hidden" id="h1"&gt; &nbsp;&nbsp;</div><div>&nbsp; 光标位置：&lt;input type="text" value="0" id="pnum" size="8"&gt; &lt;input type="button" onclick="movePoint()" value="移动光标到指定位置"&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;p&gt;&lt;/p&gt; &nbsp;&nbsp;</div><div>&nbsp; 选择指定范围：&lt;input type="text" size="9" id="sbox"&gt; -- &lt;input type="text" size="9" id="ebox"&gt; &lt;input type="button" onclick="selectText(sbox.value,ebox.value)" value="选择"&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;p&gt;&lt;/p&gt; &nbsp;&nbsp;</div><div>&nbsp; 选择查找字符 ：&lt;input type="text" value="" id="cbox" size="8"&gt; &lt;input type="button" onclick="findText(cbox.value)" value="查找下一个并选择"&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/td&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;td width="217"&gt;boundingHeight:&amp;nbsp;&lt;span id="bh"&gt;&lt;/span&gt;&lt;/td&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;td width="217"&gt;boundingWidth:&amp;nbsp;&lt;span id="bw"&gt;&lt;/span&gt;&lt;/td&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;td width="217"&gt;boundingTop:&amp;nbsp;&lt;span id="bt"&gt;&lt;/span&gt;&lt;/td&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;td width="217"&gt;boundingLeft:&amp;nbsp;&lt;span id="bl"&gt;&lt;/span&gt;&lt;/td&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;td width="217"&gt;offsetLeft:&amp;nbsp;&lt;span id="ol"&gt;&lt;/span&gt; &lt;/td&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;td width="217"&gt;offsetTop:&amp;nbsp;&lt;span id="ot"&gt;&lt;/span&gt; &lt;/td&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;td width="217"&gt;text:&amp;nbsp;&lt;span style="position: absolute; z-index: 10" id="t" &gt;&lt;/span&gt; &lt;/td&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/tr&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/table&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/body&gt; &nbsp;&nbsp;</div><div>&nbsp; &lt;/html&gt;</div></div><img src ="http://www.blogjava.net/mlzry0612/aggbug/365336.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/mlzry0612/" target="_blank">Daniel</a> 2011-12-01 23:03 <a href="http://www.blogjava.net/mlzry0612/articles/365336.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss>