javascript - Rewrite a IE Code to a FF Code -
यह कोड है (अब भरा हुआ है):
HTML:
< / P> & lt; div id = "content" contentEditable = "true" onkeyup = "highlight (this)" & gt; यह टाइप करने के लिए कुछ क्षेत्र है। & Lt; / div & gt;
जावास्क्रिप्ट:
फ़ंक्शन हाइलाइट (एएमएम) {// स्टोअर कर्सर पोजीशन ववर कर्सर पीओएस = डॉक्यूमेंट। सेलेक्शन.क्रेतेरेंज ()। डुप्लिकेट (); Var clickx = cursorPos.getBoundingClientRect ()। छोड़ दिया; Var clicky = cursorPos.getBoundingClientRect ()। शीर्ष; // div सामग्री की कॉपी सामग्री = elem.inner एचटीएमएल; Var replaceStart = ''; Var replaceEnd = ''; // यदि केवल किसी भी मैचों / स्पेस बैंड को ध्यान में रखते हुए / कर्सर को स्थानांतरित / बदलते हैं - यह डुप्लिकेट को रोकता है अगर (content.match (/ test /)) {elem.innerHTML = content.replace (/ test / g, '' + replaceStart + 'test '+ बदलें + एंड +' '); // रीसेट कर्सर और फ़ोकस कर्सरPos = document.body.createTextRange (); कर्सर Pos.moveToPoint (clickx, clicky); cursorPos.select (); }}
बस IE पर woks, unhapply। कोई भी एफएफ पर भी काम करने के लिए इस कोड को 'समायोजित' कर सकता है! ...
धन्यवाद
संपादित करें [1]:
< Br>
यह कोड स्वरूपित एक ही शब्द द्वारा एक विशेष शब्द की जगह ...
और कैरेट (कर्सर) शब्द को बदले जाने के बाद हमेशा रहें! & Lt; & lt; & lt; "यह बड़ा है"
लेकिन बस IE पर काम करता है, और मुझे एफएफ पर काम करने के लिए इस कोड को फिर से लिखना बहुत पसंद है ... लेकिन मैं ऐसा नहीं कर सकता ... इसकी इतनी मुश्किल ...
कोई भी मदद कर सकता है?
संपादित करें [2]: मेरी समस्या इस भाग के साथ ही है:
/ / रीसेट कर्सर और फ़ोकस कर्सरPos = document.body.createTextRange (); कर्सर Pos.moveToPoint (clickx, clicky); cursorPos.select ();
क्योंकि, हिलटॉओशन और चुनिंदा फ़ंक्शंस सिर्फ आईई पर काम करती हैं ... तब तक यह आसान है ... एफएफ पर फ़ंक्शंस का दूसरा सेट है जो इसे संभव बनाता है ... लेकिन मैं डॉन पता नहीं कैसे एक और कोड लिखना है जो एक ही काम करता है। क्या आप इसे प्राप्त कर सकते हैं?
आप पहले अपने वर्तमान स्थान पर एक मार्कर तत्व डालने से कैरेट स्थिति को संरक्षित कर सकते हैं तत्व के innerHTML
पर अपना प्रतिस्थापन कर रहा है (पाठ नोड्स को पार करने के लिए DOM विधियों का उपयोग करके और इच्छित पाठ के लिए प्रत्येक को खोजने के लिए innerHTML
का उपयोग करने के लिए बेहतर होगा)।
निम्नलिखित कार्य, कैरेट "पाठ" शब्द के भीतर या उसके आस-पास स्थित नहीं है मैंने इस फ़ंक्शन को हर बार एक कुंजी को दबाए जाने और आधे से दूसरे के लिए टाइपिंग को रोकने के लिए उपयोगकर्ता को रोकने के लिए टाइमर भी जोड़ा है।
function insertCaretMarker () {var range; Var मार्कर आईडी = "sel_" + नया दिनांक () + "_" + ("+ + Math.random ())। Substr (2); अगर (window.getSelection) {var sel = window.getSelection (); श्रेणी = sel.getRangeAt (0); range.collapse (सही); Var मार्कर EL = document.createElement ("span"); markerEl.appendChild (document.createTextNode ( "\ u00a0")); MarkerEl.id = markerId; range.insertNode (markerEl); } और अगर (दस्तावेज़.सेब & amp; amp; amp; दस्तावेज़.selection.createRange) {range = document.selection.createRange (); range.collapse (सही); If (range.paste एचटीएमएल) {range.paste एचटीएमएल ("& lt; span id = \" "+ मार्करआईडी +" \ "& gt; & amp; nbsp; & lt; / span & gt;"); }} वापसी मार्कर आईडी; } फ़ंक्शन पुनर्स्थापना कैरेट (मार्कर आईडी) {var el = document.getElementById (मार्कर आईडी); विभिन्न श्रेणी; अगर (एल) {if (window.getSelection & amp; amp; दस्तावेज़.createRange) {var sel = window.getSelection (); श्रेणी = दस्तावेज़.createRange (); range.setStartBefore (एल); sel.removeAllRanges (); sel.addRange (रेंज); } और अगर (document.body.createTextRange) {range = document.body.createTextRange (); range.moveToElementText (एल); range.collapse (सही); range.select (); } El.parentNode.removeChild (el); }} फ़ंक्शन को संरक्षित करेपेटीशन (फेंक) {var id = insertCaretMarker (); समारोह (); restoreCaret (आईडी); } Var हाइलाइट टाइमर; फ़ंक्शन हाइलाइट (एएमएम) {यदि (हाइलाइट टाइमर) {window.clearTimeout (हाइलाइट टाइमर); } HighlightTimer = window.setTimeout (फ़ंक्शन () {highlightTimer = null; var replaceStart = '& lt; b & gt;'; var बदलना अंत = '& lt; / b & gt;'; // यदि कोई मैचों / स्पेसबैंड - यह डुप्लिकेट्स को रोकता है यदि (elem.innerHTML.match (/ test /)) {preserveCaretPosition (फ़ंक्शन) (elem.innerHTML = elem.innerHTML.replace (/ test / g, '' + replaceStart + 'test' + replaceEnd + '');});}}, 500); }
Comments
Post a Comment