How do I modify my code to collect form input from a popup and insert it into a textarea at cursor location on original page using JavaScript?_问答_开发者

How do I modify my code to collect form input from a popup and insert it into a textarea at cursor location on original page using JavaScript?

开发者 https://www.devze.com 2023-01-07 18:43 出处：网络

The JavaScript shown below inserts form input into a textarea at the current cursor position. The textarea id=mbentry. This works if all code is on the same page.

I want to have a hypertext link on page1.php open a little popup window (page2.php for example) so the user can enter text in the popup, close the window and have the input from the window appear in the textarea (id=mbentry) on the original page. (Note: I currently use GreyBox to create my popup windows.)

How do I accomplish this? (See code below)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Page 1</title>

    <script type="text/javascript">
    window.onload = function()
    {
            btn = document.getElementById("btnInsertText");
            myText = document.getElementById("myTextArea");
            title = document.getElementById("insTitle");
            url = document.getElementById("insUrl");
            ltext = document.getElementById("insLText");
            btn.onclick = function()
            {
                insertAtCursor(myText, title.value, url.value, ltext.value);
            }
    }

    function insertAtCursor(myField, title, url, ltext)
    { 
        //IE support 
        if (document.selection)
        { 
            myField.focus();
            sel = document.selection.createRange(); 
            sel.text = '<a href="'+url+'" tit开发者_StackOverflow社区le="'+title+'" target="_blank">'+ltext+'</a>'; 
        }

        //Mozilla/Firefox/Netscape 7+ support 
        else if (myField.selectionStart || myField.selectionStart == '0')
        {  
            var startPos = myField.selectionStart;
            var endPos = myField.selectionEnd; 
            myField.value = myField.value.substring(0, startPos)+ '<a href="'+url+'" title="'+title+'" target="_blank">'+ltext+'</a>' + myField.value.substring(endPos, myField.value.length);
        }

        else
        { 
            myField.value += myValue; 
        } 
    }       
    </script>

</head>
<body>
url: <input type="text" id="insUrl" /><br />
title: <input type="text" id="insTitle" /><br />
linked text: <input type="text" id="insLText" /><br />
<input type="button" id="btnInsertText" value="Insert Link" /><br /><br />
<textarea id="myTextArea" rows="6" cols="50"></textarea>
</body>
</html>

From the popup you can call window.parent.insertAtCursor(...)

Thank you for your help.

I wasn't able to get it working using window.parent or top.window (the GreyBox method). After much research I decided to use a hidden div that contains my form input elements. The div appears when an "Insert URL" button is clicked. Because the div is on the same page as the textarea, I don't need to pass the info. back to the parent window anymore. I think showing and hiding a div with the input fields will suffice for now. If I come up with a better method using the GreyBox popup I'll share. Thanks again!