天天看點

textarea光标定位問題

在項目中解決textarea光标定位問題,讓光标定位在内容裡面或内容後面

function savePos(textBox){

 //如果是Firefox(1.5)的話,方法很簡單

 if(typeof(textBox.selectionStart) == "number"){

  start = textBox.selectionStart;

  end = textBox.selectionEnd;

 }

 //下面是IE(6.0)的方法,麻煩得很,還要計算上'\n'

 else if(document.selection){

  var range = document.selection.createRange();

  if(range.parentElement().id == textBox.id){

 // create a selection of the whole textarea

  var range_all = document.body.createTextRange();

  range_all.moveToElementText(textBox);

 //兩個range,一個是已經選擇的text(range),一個是整個textarea(range_all)

 //range_all.compareEndPoints()比較兩個端點,如果range_all比range更往左(further to the left),則 //傳回小于0的值,則range_all往右移一點,直到兩個range的start相同。

 // calculate selection start point by moving beginning of range_all to beginning of range

 for (start=0; range_all.compareEndPoints("StartToStart", range) < 0; start++)

  range_all.moveStart('character', 1);

 // get number of line breaks from textarea start to selection start and add them to start

 // 計算一下\n

 for (var i = 0; i <= start; i ++){

  if (textBox.value.charAt(i) == '\n')

   start++;

 }

 // create a selection of the whole textarea

 var range_all = document.body.createTextRange();

 range_all.moveToElementText(textBox);

 // calculate selection end point by moving beginning of range_all to end of range

 for (end = 0; range_all.compareEndPoints('StartToEnd', range) < 0; end ++)

  range_all.moveStart('character', 1);

 // get number of line breaks from textarea start to selection end and add them to end

 for (var i = 0; i <= end; i ++){

  if (textBox.value.charAt(i) == '\n')

 end ++;

 }

 }

 }

}

<textarea name="empGzdw3" id="empGzdw3" style="width:230px;height:38px;" onKeydown="savePos(this)" onKeyup="savePos(this)"

     οnmοusedοwn="savePos(this)" οnmοuseup="savePos(this)" οnfοcus="savePos(this)"></textarea>

繼續閱讀