दस्तावेज.execCommand ("insertText", ...) के लिए इंटरनेट एक्सप्लोरर विकल्प, पाठ प्रविष्टि के लिए जिसे उपयोगकर्ता द्वारा पूर्ववत/दोबारा किया जा सकता है

Question

जब उपयोगकर्ता contenteditable div संपादित करता है, और कुछ कुंजियां दबाता है, तो मैं ओवरराइड करना चाहता हूं डिफ़ॉल्ट व्यवहार उदाहरण के लिए, जब उपयोगकर्ता ENTER दबाता है तो मैं एक सामान्य लाइन ब्रेक डालना चाहता हूं। मुझे लगता है कि document.execCommand("insertText",...)

इस का उपयोग करते हुए एक ही रास्ता मैं अब तक पाया है इस कार्रवाई पूर्ववत करने योग्य और redoable उपयोगकर्ता द्वारा बनाने के लिए है।

<div id="editor" contenteditable="true" style="white-space:pre-wrap"> 
Some text.... 
</div> 

<script> 
$("#editor").keydown(function(evt){ 
    console.log(evt.keyCode); 
    if(evt.keyCode==13){ 
     document.execCommand("insertText",false,"\n"); 
     evt.preventDefault(); 
     evt.stopPropagation(); 
    } 
} 
</script> 

यह कोड क्रोम और फ़ायरफ़ॉक्स पर अच्छी तरह से काम करता है। लेकिन, यानी "inserttext" का समर्थन नहीं करता है। यानी पाठ को सम्मिलित करने का कोई तरीका होगा, जैसे कि उपयोगकर्ता पूर्ववत कर सकता है?

Answer 1

आईई 11 में ms-beginUndoUnit और ms-endUndoUnit आदेश हैं।

मैंने इनका उपयोग करके आईई 11 के लिए एक समाधान समाधान बनाने की कोशिश की और विफल रहा। लाइन ब्रेक डालने से डीओएम रेंज और चयन के साथ मुश्किल होती है; आप आईई में अपनी विरासत document.selection और TextRange ऑब्जेक्ट्स का उपयोग करके इसे अधिक आसानी से कर सकते हैं लेकिन दुर्भाग्यवश आईई 11 ने document.selection हटा दिया (लेकिन टेक्स्टरेंज नहीं, अजीब तरह से) जो इसे मुश्किल बनाता है। चयन से टेक्स्टरेंज बनाने के लिए एक बुरा कामकाज कोड करने के बाद, पूर्ववत काम नहीं किया। यहाँ मैं क्या किया है:

http://jsfiddle.net/E7sBD/2

मैं एक डोम रेंज और चयन वस्तुओं का उपयोग करके यात्रा करने का निर्णय लिया। लाइन ब्रेक सम्मिलन कोड चित्रकारी है और किसी भी गंभीर के लिए इसका उपयोग नहीं किया जाना चाहिए क्योंकि इसमें कहीं भी कैरेट देने के लिए एक गैर-ब्रेकिंग स्पेस जोड़ना शामिल है (इसे <br> के बाद सीधे रखने की कोशिश कर रहा है)। पूर्ववत करना सम्मिलित सामग्री को हटा देता है लेकिन दुर्भाग्य से कैरेट को स्थानांतरित नहीं करता है।

http://jsfiddle.net/E7sBD/4/

Answer 2

तुम हमेशा इनपुट div पर परिवर्तन घटना को पकड़ने और अपनी पसंद के इनपुट स्ट्रिंग से पिछले चार बदलने के लिए सरल और अधिक स्थिर रास्ता तय कर सकते हैं।

http://api.jquery.com/change का आविष्कार किया है मैं उस उद्देश्य :) अपने दूत

परिवर्तन के लिए लगता है और आप एक पूरी नई दुनिया देखें: 3