網(wǎng)頁中可編輯區(qū)域光標定位方法
【專利摘要】本發(fā)明提出了網(wǎng)頁中可編輯區(qū)域光標定位方法，該方法包括以下步驟：a.獲取光標所在的可編輯區(qū)域標簽相對于網(wǎng)頁的絕對位置；b.復制與可編輯區(qū)域標簽樣式相同的可嵌入其他標簽的標簽，記錄可嵌入其他標簽的標簽相對于網(wǎng)頁的絕對位置；c.統(tǒng)計可編輯區(qū)域中起始位置至光標所在位置的字符串內(nèi)容及長度并復制至可嵌入其他標簽的標簽中；d.在可嵌入其他標簽的標簽的光標所在位置處添加一標記標簽，記錄標記標簽相對于網(wǎng)頁的絕對位置；e.計算可嵌入其他標簽的標簽相對于可編輯區(qū)域的標簽坐標位置變化；f.確定可編輯區(qū)域光標相對于網(wǎng)頁的絕對位置。本發(fā)明采用技術(shù)簡單，可操作性強，可快速實現(xiàn)光標定位，且不受瀏覽器的限制。
【專利說明】網(wǎng)頁中可編輯區(qū)域光標定位方法

【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及定位技術(shù)，特別涉及網(wǎng)頁中可編輯區(qū)域光標定位方法。

【背景技術(shù)】
[0002]網(wǎng)絡(luò)技術(shù)的發(fā)展，互聯(lián)網(wǎng)終端的普及，辦公和生活的需要等因素，使網(wǎng)絡(luò)成為很多用戶日常活動不可或缺的部分。用戶在打開網(wǎng)頁使用可編輯區(qū)域框的時候遇到一個問題:本該在光標位置處顯示的提示信息或特殊標識不準確，偏離光標顯示。由于不同的字符占的字節(jié)數(shù)不同，瀏覽器在計算光標位置的時候會出現(xiàn)不準確的情況。該問題給用戶不僅帶來了視覺上的不便，而且可能影響用戶正確使用編輯框。
[0003]現(xiàn)有的網(wǎng)頁中光標定位方法解決的一般是打開網(wǎng)頁光標直接在可編輯區(qū)域的某個位置出現(xiàn)，減少人工移動光標的動作，和上面的問題不屬于同一類型。IE瀏覽器采用專有的封裝函數(shù)解決了上述問題，但是，該方法不適用于其他類型的瀏覽器。用戶在使用其他瀏覽器的時候要么使用不同的方法來解決該問題；要么不處理該問題，光標位置的提示信息顯示就可能錯誤。由此可能帶來不兼容的問題，缺少統(tǒng)一而又普遍適用的解決方法。
[0004]有鑒于此，需要一種簡便而又適用于任何瀏覽器的可編輯區(qū)域內(nèi)光標定位的統(tǒng)一方法來解決現(xiàn)有用戶的使用問題。


【發(fā)明內(nèi)容】

[0005]針對以上問題，本發(fā)明提出了網(wǎng)頁中可編輯區(qū)域光標定位方法，該方法主要由以下步驟:首先獲取可編輯區(qū)域相對于網(wǎng)頁的絕對位置，然后復制與可編輯區(qū)域標簽樣式相同的可嵌入其他標簽的標簽，記錄可嵌入其他標簽的標簽相對于網(wǎng)頁的絕對位置，復制可編輯區(qū)域光標前的內(nèi)容至可嵌入其他標簽的標簽內(nèi)，在可嵌入其他標簽的標簽內(nèi)容的光標位置處添加一可標記標簽并記錄可標記標簽的絕對位置，根據(jù)可嵌入其他標簽的標簽的位置移動量確定光標的具體位置。
[0006]為實現(xiàn)上述
【發(fā)明內(nèi)容】
，本發(fā)明采用了網(wǎng)頁中可編輯區(qū)域光標定位方法，該方法的實現(xiàn)步驟如下:
[0007]a.獲取光標所在的可編輯區(qū)域標簽相對于網(wǎng)頁的絕對位置(X，Y)；
[0008]b.復制與可編輯區(qū)域標簽樣式相同的可嵌入其他標簽的標簽，記錄可嵌入其他標簽的標簽相對于網(wǎng)頁的絕對位置(X' ,Y')；
[0009]c.統(tǒng)計可編輯區(qū)域中起始位置至光標所在位置的字符串內(nèi)容及長度并復制至可嵌入其他標簽的標簽中；
[0010]d.在可嵌入其他標簽的標簽的光標所在位置處添加一標記標簽，記錄標記標簽相對于網(wǎng)頁的絕對位置(M，N)；
[0011]e.計算可嵌入其他標簽的標簽相對于可編輯區(qū)域的標簽坐標位置變化(ΛΧ，
厶丫^其中厶叉二父'-X, Ay = Y' -Y;
[0012]a.根據(jù)可嵌入其他標簽的標簽的位置變化，確定可編輯區(qū)域光標相對于網(wǎng)頁的絕對位置(Μ-Λ x，N-Ay)。
[0013]所述可編輯區(qū)域標簽類型主要包括textarea標簽、input標簽。
[0014]所述標記標簽可以是HTML中可在可編輯區(qū)域用作標記的任何類型的標簽。
[0015]光標位置的變化量與可嵌入其他標簽的標簽位置的變化量是相同的。
[0016]光標位置在原可編輯區(qū)域發(fā)生變化時，可嵌入其他標簽的標簽中原內(nèi)容清除，重新進行可編輯區(qū)域光標定位；光標位置變化至新的可編輯區(qū)域時，再次執(zhí)行光標定位的所有步驟。
[0017]進一步，在得到光標位置后可作進一步的操作，本發(fā)明中為可標記標簽添加背景顏色，增強光標位置的效果，即使位置快速變化仍然不會對用戶帶來困擾；或者增加相關(guān)語句、圖片、視頻等內(nèi)容。
[0018]與現(xiàn)有技術(shù)相比，本發(fā)明采用技術(shù)簡單，可操作性強，可快速實現(xiàn)光標定位，且不受瀏覽器的限制。

【專利附圖】

【附圖說明】
[0019]圖1為本發(fā)明所提供的網(wǎng)頁中可編輯區(qū)域光標定位方法的流程圖；
[0020]圖2為本發(fā)明所提供的網(wǎng)頁中可編輯區(qū)域光標定位方法的實施例一；
[0021]圖3為本發(fā)明所提供的網(wǎng)頁中可編輯區(qū)域光標定位方法的實施例二。

【具體實施方式】
[0022]為了使本發(fā)明所提到的網(wǎng)頁中可編輯區(qū)域光標定位方法及其優(yōu)點更加清楚明確，以下參照附圖對本發(fā)明進行更進一步的詳細說明。
[0023]圖1為本發(fā)明所提供的網(wǎng)頁中可編輯區(qū)域光標定位方法的流程圖，如圖1所示，該方法的主要流程步驟如下:
[0024]步驟101，獲取光標所在的可編輯區(qū)域標簽相對于網(wǎng)頁的絕對位置。
[0025]以網(wǎng)頁頁面坐標位置為參照，獲取光標所在的可編輯區(qū)域相對于網(wǎng)頁頁面的絕對坐標位置。
[0026]步驟102，復制與可編輯區(qū)域標簽樣式相同的可嵌入其他標簽的標簽，記錄可嵌入其他標簽的標簽相對于網(wǎng)頁的絕對位置。
[0027]根據(jù)可編輯區(qū)域的樣式信息，自動在指定區(qū)域復制與可編輯區(qū)域標簽樣式完全相同的可嵌入其他標簽的標簽，獲取并記錄可嵌入其他標簽的標簽相對于網(wǎng)頁的絕對坐標位置。其中，可嵌入其他標簽的標簽的指定位置可以是與可編輯區(qū)域重合的，也可以是不同的位置。
[0028]步驟103，統(tǒng)計可編輯區(qū)域中起始位置至光標所在位置的字符串內(nèi)容及長度并復制至可嵌入其他標簽的標簽中。
[0029]字符串的位置在可編輯區(qū)域內(nèi)是無法獲取的，需要在復制的字符串后添加可標記其位置的標簽，轉(zhuǎn)向步驟104。
[0030]步驟104，在可嵌入其他標簽的標簽的光標所在位置處添加一標記標簽，記錄標記標簽相對于網(wǎng)頁的絕對位置。
[0031]標記標簽可以是HTML中可用作標記位置的標簽，獲取和記錄標記標簽相對于網(wǎng)頁的絕對坐標位置，且標簽的樣式可以是多樣的。
[0032]步驟105，計算可嵌入其他標簽的標簽相對于可編輯區(qū)域的標簽坐標位置變化。
[0033]根據(jù)前面步驟獲取的可編輯區(qū)域的坐標位置與可嵌入其他標簽的標簽的坐標位置信息，計算可嵌入其他標簽的標簽相對于可編輯區(qū)域的坐標的位置變化。
[0034]步驟106，根據(jù)可嵌入其他標簽的標簽的位置變化，確定可編輯區(qū)域光標位置的變化。
[0035]可嵌入其他標簽的標簽中標記標簽坐標位置的變化與可嵌入其他標簽的標簽位置相對于可編輯區(qū)域的位置的變化是相同的，至此，可編輯區(qū)域的光標位置即可確定。
[0036]光標位置在原可編輯區(qū)域發(fā)生變化時，可嵌入其他標簽的標簽中原內(nèi)容清除，重新執(zhí)行可編輯區(qū)域光標定位步驟；光標位置變化至新的可編輯區(qū)域時，再次執(zhí)行光標定位的所有步驟。
[0037]圖2為本發(fā)明所提供的網(wǎng)頁中可編輯區(qū)域光標定位方法的實施例一，在本實施例中可編輯框選用textarea標簽，光標在第二行的第七個字符處，該實施例的實現(xiàn)過程如下:
[0038]獲取網(wǎng)頁頁面2的坐標(0，0)和textarea標簽2011相對于網(wǎng)頁頁面2的絕對位置坐標(X，Y);在網(wǎng)頁頁面2的另一位置處自動創(chuàng)建一個與textarea標簽2011樣式完全相同的div標簽2012，獲取div標簽2012相對于網(wǎng)頁頁面2的絕對位置坐標(X'，V );利用現(xiàn)有技術(shù)可知，textarea標簽2011起始位置至光標前的字符串為“Fsdfsdfsdfsdfs4412fere”且可同時得到字符串的長度；復制字符串內(nèi)容至div標簽2012中；緊接字符串的即是光標位置處，在光標位置處添加span標簽2013做標記標簽，為了使光標位置容易查看，該實施例使span標簽2013占幾個字符顯示；獲取span標簽2013相對于網(wǎng)頁頁面2的絕對位置坐標(M, N);計算div標簽2012坐標位置的變化量(Δχ，Δ y)，其中Δχ = Χ' -X, Ay = Y1 -Y ;可知span標簽2013位置相對于textarea標簽2011光標位置的變化量是相同的(Δχ，Ay)，則textarea標簽2011光標相對于網(wǎng)頁頁面2的坐標位置為(Μ- Δ X，N- Δ y)。
[0039]本實施例為了使說明清楚，把textarea標簽與div標簽分開顯示，實際使用時可讓其重合或者放在網(wǎng)頁其他指定位置處。
[0040]在獲得了 textarea標簽的光標位置后，可做進一步方便用戶的操作，如可添加相應(yīng)的提示信息、圖片、視頻等。
[0041]圖3為本發(fā)明所提供的網(wǎng)頁中可編輯區(qū)域光標定位方法的實施例二，在本實施例中可編輯框選用input標簽，該實施例的實現(xiàn)過程如下:
[0042]獲取網(wǎng)頁頁面2的坐標(0，0)和input標簽2021相對于網(wǎng)頁頁面2的絕對位置坐標(X，Y);在網(wǎng)頁頁面2的另一位置處自動創(chuàng)建一個與input標簽2021樣式完全相同的div標簽2022，獲取div標簽2022相對于網(wǎng)頁頁面2的絕對位置坐標(X' ,Y');利用現(xiàn)有技術(shù)可知，input標簽2021起始位置至光標前的字符串為“ceshi測試testin”且可同時得到字符串的長度；復制字符串內(nèi)容至div標簽2022中；緊接字符串的即是光標位置處，在光標位置處添加span標簽2023做標記標簽,為了使光標位置容易查看,本實施例同時復制了光標之后的字符串并把相同長度的span標簽2023覆蓋到該字符串上面，隨著光標位置的變化字符串長度隨之改變，此時用戶可以看到總體字符串的長度；獲取span標簽2023相對于網(wǎng)頁頁面2的絕對位置坐標(M，N);計算div標簽2022坐標位置的變化量(Δ X, Δ y),其中Δ X = X' ~X, Ay = Y' -Y ;可知span標簽2023位置相對于input標簽2021光標位置的變化量是相同的(Δχ，Ay)，貝Ij input標簽2021光標相對于網(wǎng)頁頁面2的坐標位置為(Μ- Δ X，N- Δ y)。
[0043]可嵌入其他標簽的標簽在HTML的標簽中有很多種，實現(xiàn)方式與實施例一和二相同，本【技術(shù)領(lǐng)域】人員應(yīng)該能夠理解，在此不再一一列舉。
[0044]以上所述是對本發(fā)明的較佳的【具體實施方式】，本【技術(shù)領(lǐng)域】人員應(yīng)當理解，所述實施方式并非限定本發(fā)明的保護范圍。在不脫離本發(fā)明的精神實質(zhì)和原則下，在細節(jié)方面可以進行變化或者修改，均應(yīng)涵蓋在本發(fā)明的權(quán)利要求范圍之內(nèi)。
【權(quán)利要求】
1.網(wǎng)頁中可編輯區(qū)域光標定位方法，其特征在于，該方法包括以下步驟: a.獲取光標所在的可編輯區(qū)域標簽相對于網(wǎng)頁的絕對位置(X，Y)； b.復制與可編輯區(qū)域標簽樣式相同的可嵌入其他標簽的標簽，記錄可嵌入其他標簽的標簽相對于網(wǎng)頁的絕對位置(X' ,Y')； c.統(tǒng)計可編輯區(qū)域中起始位置至光標所在位置的字符串內(nèi)容及長度并復制至可嵌入其他標簽的標簽中； d.在可嵌入其他標簽的標簽的光標所在位置處添加一標記標簽，記錄標記標簽相對于網(wǎng)頁的絕對位置(M，N)； e.計算可嵌入其他標簽的標簽相對于可編輯區(qū)域的標簽坐標位置變化(ΛX，Ay)，其中 Λχ = X' -X, Ay = Y' -Y ； f.根據(jù)可嵌入其他標簽的標簽的位置變化，確定可編輯區(qū)域光標相對于網(wǎng)頁的絕對位置(Μ-Λχ，N-Ay)。
2.如權(quán)利要求1所述的網(wǎng)頁中可編輯區(qū)域光標定位方法，其特征在于，所述可編輯區(qū)域標簽類型主要包括textarea標簽、input標簽。
3.如權(quán)利要求1所述的網(wǎng)頁中可編輯區(qū)域光標定位方法，其特征在于，所述標記標簽可以是HTML中可在可編輯區(qū)域用作標記的任何類型的標簽。
4.如權(quán)利要求1所述的網(wǎng)頁中可編輯區(qū)域光標定位方法，其特征在于，光標位置的變化量與可嵌入其他標簽的標簽位置的變化量是相同的。
5.如權(quán)利要求1所述的網(wǎng)頁中可編輯區(qū)域光標定位方法，其特征在于，光標位置在原可編輯區(qū)域發(fā)生變化時，可嵌入其他標簽的標簽中原內(nèi)容清除，重新進行可編輯區(qū)域光標定位；光標位置變化至新的可編輯區(qū)域時，再次執(zhí)行光標定位的所有步驟。
【文檔編號】G06F17/24GK104050152SQ201310081737
【公開日】2014年9月17日 申請日期:2013年3月15日 優(yōu)先權(quán)日:2013年3月15日
【發(fā)明者】牟春林, 黃仁 申請人:蘇州精易會信息技術(shù)有限公司