देवनागरी दांडा ("।") के साथ वर्टिकल बार ("।") को बदलकर जैसे ही इसे टेक्स्टरेरा

में टाइप किया गया है, मैं वर्णिकल बार (|) को देवनागरी दांडा (।) के साथ बदलना चाहता हूं जैसे ही इसे टेक्स्टरेरा में टाइप किया जाता है जावास्क्रिप्ट का उपयोग कर।देवनागरी दांडा ("।") के साथ वर्टिकल बार ("।") को बदलकर जैसे ही इसे टेक्स्टरेरा

सबसे पहले मैंने How to change characters typed in Firefox पर दिए गए समाधान की कोशिश की। लेकिन यह चरित्र को केवल अंत तक जोड़ता है।

तो, मैंने http://www.jsfiddle.net/EXH2k/6/ पर दिए गए समाधान का पालन किया जिसे टिम डाउन द्वारा Changing the keypress पर और show different keyboard character from the typed one in google chrome पर भी सुझाव दिया गया था। लेकिन यह मेरे लिए काम नहीं करता है (न तो फ़ायरफ़ॉक्स में और न ही आईई 10 में)।

कोड:

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <link type="text/css" rel="stylesheet" href="stylesheet.css" /> 
    <script type="text/javascript"> 
     function transformTypedChar(charStr) { 
      return charStr == "|" ? "।" : charStr; 
     } 

     function getInputSelection(el) { 
      var start = 0, end = 0, normalizedValue, range, 
      textInputRange, len, endRange; 

      if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") { 
       start = el.selectionStart; 
       end = el.selectionEnd; 
      } else { 
       range = document.selection.createRange(); 

       if (range && range.parentElement() == el) { 
        len = el.value.length; 
        normalizedValue = el.value.replace(/\r\n/g, "\n"); 

        // Create a working TextRange that lives only in the input 
        textInputRange = el.createTextRange(); 
        textInputRange.moveToBookmark(range.getBookmark()); 

        // Check if the start and end of the selection are at the very end 
        // of the input, since moveStart/moveEnd doesn't return what we want 
        // in those cases 
        endRange = el.createTextRange(); 
        endRange.collapse(false); 

        if (textInputRange.compareEndPoints("StartToEnd", endRange) > -1) { 
         start = end = len; 
        } else { 
         start = -textInputRange.moveStart("character", -len); 
         start += normalizedValue.slice(0, start).split("\n").length - 1; 

         if (textInputRange.compareEndPoints("EndToEnd", endRange) > -1) { 
          end = len; 
         } else { 
          end = -textInputRange.moveEnd("character", -len); 
          end += normalizedValue.slice(0, end).split("\n").length - 1; 
         } 
        } 
       } 
      } 

      return { 
       start: start, 
       end: end 
      }; 
     } 

     function offsetToRangeCharacterMove(el, offset) { 
      return offset - (el.value.slice(0, offset).split("\r\n").length - 1); 
     } 

     function setInputSelection(el, startOffset, endOffset) { 
      el.focus(); 
      if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") { 
       el.selectionStart = startOffset; 
       el.selectionEnd = endOffset; 
      } else { 
       var range = el.createTextRange(); 
       var startCharMove = offsetToRangeCharacterMove(el, startOffset); 
       range.collapse(true); 
       if (startOffset == endOffset) { 
        range.move("character", startCharMove); 
       } else { 
        range.moveEnd("character", offsetToRangeCharacterMove(el, endOffset)); 
        range.moveStart("character", startCharMove); 
       } 
       range.select(); 
      } 
     } 

     $("#inputTextArea").keypress(function (evt) { 
      if (evt.which) { 
       var charStr = String.fromCharCode(evt.which); 
       var transformedChar = transformTypedChar(charStr); 
       if (transformedChar != charStr) { 
        var sel = getInputSelection(this), val = this.value; 
        this.value = val.slice(0, sel.start) + transformedChar + val.slice(sel.end); 

        // Move the caret 
        setInputSelection(this, sel.start + 1, sel.start + 1); 
        return false; 
       } 
      } 
     }); 
    </script> 
</head> 
<body> 
    <textarea name="input" id="inputTextArea" rows="10"></textarea> 
</body> 
</html>

स्रोत

2013-10-03 jyotesh

बहुत आसान है कि। नई-पंक्तियों से निपटने आदि के साथ अपने कोड को फेंक दें और सिर्फ है कि:

$(document).ready(function() { 
    $('#my-input').on('input', function() { 
     var $input = $(this), 
      curVal = $input.val(); 
     var cursorPos = curVal.slice(0, this.selectionStart).length; 

     $input.val(curVal.replace(/[|]/g, '।')); 
     this.setSelectionRange(cursorPos, cursorPos); 
    }); 
});

कार्य उदाहरण: | (।) JSFiddle

स्रोत

2013-10-03 08:00:43 schlingel

Btw: मैं लिनक्स चल रहा हूँ तो मैं केवल क्रोम और एफएफ में यह परीक्षण किया गया। शायद आईई में समस्याएं हैं: -/ – schlingel

+1 कैरेट स्थिति को संरक्षित करने और पेस्ट का समर्थन करने के लिए +1। –

धन्यवाद। यह फ़ायरफ़ॉक्स में काम करता है, लेकिन आईई में नहीं। लेकिन यह ठीक है। – jyotesh

मैं कार्यक्षेत्र बार बदलना चाहते हैं() देवनागरी Danda साथ जैसे ही क्योंकि यह जावास्क्रिप्ट का उपयोग कर textarea में टाइप किया गया है।

जब से तुम जैसे ही यह लिखा गया एक चरित्र बदलना चाहते हैं, यह हो सकता है सबसे आसान विकल्प:

$('#inputTextArea').on("keyup", function(e) { 
    $(this).val($(this).val().replace(/[|]/g, "।")); 
});

मैंने देखा है कि यद्यपि आप jQuery टैग नहीं किया गया है, तो आप में jQuery का उपयोग कर रहे अपने कोड। इसलिए एक jQuery आधारित समाधान।

एक त्वरित बेला: http://jsfiddle.net/THEre/

स्रोत

2013-10-03 08:32:47 Abhitalks

+1 क्योंकि मैंने आपके द्वारा/[|]/g पैटर्न लिया था। लेकिन आपका कोड कर्सर pos को संभाल नहीं करता है। – schlingel

बेशक @ स्क्लिंगल हां, मैंने कम से कम उसे एक दिशा देने के लिए उसके लिए एक त्वरित और गंदे समाधान को धराशायी कर दिया। आपका एक और पूरा समाधान है और मैं पहले से ही आपको +1 कर चुका हूं। :) – Abhitalks

देवनागरी दांडा ("।") के साथ वर्टिकल बार ("।") को बदलकर जैसे ही इसे टेक्स्टरेरा

उत्तर

संबंधित मुद्दे