क्या उपयोगकर्ता टाइप करते समय टेक्स्ट इनपुट फ़ील्ड की सामग्री को बदलने के लिए जावास्क्रिप्ट या jQuery का उपयोग करना संभव है?

उदा. इनपुट कर्सर को उसी स्थिति में रखते हुए a + up टाइप करने से a å में बदल जाएगा।

4
JJJollyjim 28 अगस्त 2011, 00:33

2 जवाब

सबसे बढ़िया उत्तर

हां, इसे तुरंत बदलें और selectionStart और selectionEnd को पिछली स्थिति में रखें: http://jsfiddle.net/pimvdb/p2jL3/3/

selectionStart और selectionEnd चयन सीमा का प्रतिनिधित्व करते हैं, और जब कोई चयन नहीं होता है तो एक दूसरे के बराबर होते हैं, इस मामले में वे कर्सर की स्थिति का प्रतिनिधित्व करते हैं।

संपादित करें: इसका एक jQuery प्लगइन बनाने का निर्णय लिया, क्योंकि यह बाद में काम आ सकता है और इसे कहीं भी लागू करना आसान है।

(function($) {
    var down         = {}; // keys that are currently pressed down
        replacements = { // replacement maps
            37: { // left
                'a': 'ã'
            },

            38: { // up
                'a': 'â'
            },

            39: { // right
                'a': 'á'
            },

            40: { // down
                'a': 'à'
            }
        };

    $.fn.specialChars = function() {
        return this.keydown(function(e) {
            down[e.keyCode] = true; // this key is now down

            if(down[37] || down[38] || down[39] || down[40]) { // if an arrow key is down
                var value   = $(this).val(),                         // textbox value
                    pos     = $(this).prop('selectionStart'),        // cursor position
                    char    = value.charAt(pos - 1),                 // old character
                    replace = replacements[e.keyCode][char] || char; // new character if available

                $(this).val(value.substring(0, pos - 1) // set text to: text before character
                            + replace                   // + new character
                            + value.substring(pos))     // + text after cursor

                      .prop({selectionStart: pos,   // reset cursor position
                             selectionEnd:   pos});

                return false; // prevent going to start/end of textbox
            }
        }).keyup(function(e) {
            down[e.keyCode] = false; // this key is now not down anymore
        }).blur(function() {
            down = {}; // all keys are not down in the textbox when it loses focus
        });
    };
})(jQuery);
5
pimvdb 28 अगस्त 2011, 01:11
@ जेजे 56: चीयर्स, यह उल्लेख करना भूल गया कि (जहां तक ​​​​मुझे पता है) यह आईई 8- पर समर्थित नहीं है।
 – 
pimvdb
28 अगस्त 2011, 00:53

मुझे एक बार ऐसा ही करना था। मुझे लगता है कि यह बहुत आसान है। अपनी आवश्यकताओं को पूरा करने के लिए इसे संशोधित करें:

$("input#s").keyup(function(e) {
    var m=$("input#s");
    var value= m.val();
    var pos = m.prop('selectionStart');
    value=value.replace(">","»");
    m.val(value);
    m.prop({'selectionStart':pos,'selectionEnd':pos});
});
-1
squgeim 22 अप्रैल 2013, 17:51