Inserting text at the cursor position within a textarea using javascript

Posted on 2007-10-18
Last Modified: 2013-12-07
Good morning.  I need to figure out how to reliably Insert text at the EXACT cursor position within a textarea using javascript.  

In doing some quick research on the topic, I learned that this works inconsistently across different browsers, and my tests have confirmed this as well.

For example, .. it seems to work pretty well in Internet Explorer, .. but Firefox seems to have a problem with it.  And I haven't even tested it in Safari.  

Does anyone here know of a way that I could custom program this type of functionality (perhaps using javascript-based user agent detection which writes in different javascript based on which browser is detected) -- so that it works consistently across browsers? Ideally, I'd like to get it to work consistently in Internet Explorer, Firefox, and Safari.    

Or ... is inserting text at the EXACT cursor position within a textarea only possible In Internet Explorer?  Please advise.

- Yvan

Question by:IDEASDesign
    LVL 75

    Expert Comment

    by:Michel Plungjan
    I have only seen IE do this consistently
    Firefox might have a way too....

    The search is the title of your question plus firefox

    and another word to use is Caret which is the cursor in the textarea
    LVL 48

    Accepted Solution

    I use this JS-function to do this:
    * This function inserts a text at the current cursor position
    * @param string text to insert at current position
    * @param DOMElement field in which the value should be inserted
    function insertAtCurrentPosition(value, dest)
        /* for Internet Explorer */
        if (document.selection) {
            var sel = document.selection.createRange();
            sel.text = value;
        /* for Mozilla */
        else if (dest.selectionStart || dest.selectionStart == '0') {
            var startPos = dest.selectionStart;
            var endPos = dest.selectionEnd;
            dest.value = dest.value.substring(0, startPos)
                + value
                + dest.value.substring(endPos, dest.value.length);
        } else {
            dest.value += value;


    Author Comment

    Thanks so much! The script works great!

    - Yvan

    Featured Post

    6 Surprising Benefits of Threat Intelligence

    All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

    Join & Write a Comment

    Do you come here a lot? Are you lazy like me and don't want to go through the "trouble" of having to click your Dock's Safari icon and then having to click your Experts Exchange Favorites bookmark to get here? Well then this article is for you.
    Citrix XenApp, Internet Explorer 11 set to Enterprise Mode and using central hosted sites.xml file.
    Viewers will learn about arithmetic and Boolean expressions in Java and the logical operators used to create Boolean expressions. We will cover the symbols used for arithmetic expressions and define each logical operator and how to use them in Boole…
    Google currently has a new report that is in beta and coming soon to Webmaster Tool accounts. This Micro Tutorial will highlight new features for Google Webmaster Tools.

    728 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    21 Experts available now in Live!

    Get 1:1 Help Now