可編輯DIV設定游標位置

2022-03-18 23:59:40 字數 636 閱讀 4966

平時我們使用文字框input, textarea時,我們有時候需要得到游標的位置或者說設定游標的位置.

但是文字框有個不足,就是不能滿足我們插入或者其他的一些要求.

所以有時候我們使用div來代替文字框.

今天為了搞定設定di的游標位置.頭疼啊,終於可以了,記錄一下,網上資料不多.

首先要讓div啟用編輯模式.

true id="

divtest

">

通過設定contenteditable=true開啟div的編輯模式.這樣div就可以跟文字框一樣輸入內容了。

不扯話題了。下面說怎麼獲取或設定游標位置.

2個步驟

1:獲取div中的游標位置

2:改變游標位置

var cursor = 0; //

游標位置

document.onselectionchange =function ()

}

給document繫結游標變化事件。用來記錄游標位置.

這樣就可以拿到div的游標位置了.

function moveend(obj)

通過上面的我們就可以將div中的游標移動到最後面了..

可編輯div游標位置

參考 mdn上提示這些api不穩定。應該是相容ie9 谷歌,火狐 1.var sel window.getselection 變數sel是當前頁面被選中區域 2.var objrange sel.getrangeat 0 獲得選中區域的range物件 startoffset和endoffset代表了...

可編輯div在游標位置插入指定內容

在游標位置插入內容 insertcontent content let sel null if document.selection else 需注意 在谷歌瀏覽器下測試發現 document.execcommand inserhtml false 當使用這種方式插入html內容時,p標籤不見了,只...

div可編輯 可拖動

可編輯設定contenteditable屬性可以讓div程式設計可編輯狀態 2 可拖動 move draggable 使用jquery ui的draggable可以讓div變成可拖動狀態,但是如果兩個屬性同時應用就會出現可編輯功能失效的狀況。可編輯var divtitle move divtitle...