Question

我需要将输入字段中的文本/字符串插入到已经包含一些文本的文本区域中。插入的字符串必须位于光标的位置，并且需要一个用于插入的按钮。

有没有办法用JavaScript完成这个？

提前谢谢

P.S。应该插入的文本/字符串是使用PHP

从数据库中获取的

Answer 1

@ Kamia的代码示例在正确的轨道上。这是您的测试的完整实现。根据您的描述，我假设在您的真实代码中，您可能会使用某些类型的查找来检索要添加到textarea的文本。如果是这种情况，则需要对服务器进行某种类型的Ajax调用。我建议使用 jQuery's Ajax features 。

<html>
 <head>
  <title>Test Page</title>
  <script type="text/javascript">
    window.onload = function(){
       btn = document.getElementById("btnInsertText");
       myText = document.getElementById("myTextArea");
       text = document.getElementById("textToInsert");
       btn.onclick = function(){
          insertAtCursor(myText, text.value);
       }
    }

    function insertAtCursor(myField, myValue) { 
        //IE support 
        if (document.selection) { 
            myField.focus(); 
            sel = document.selection.createRange(); 
            sel.text = myValue; 
        }
            //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)+ myValue 
                 + myField.value.substring(endPos, myField.value.length); 
            } else { 
                myField.value += myValue; 
            } 
        }       
    </script>
 </head>
 <body>
   Text To Insert:<input type="text" id="textToInsert" />
   <input type="button" id="btnInsertText" value="Insert Text" /><br/>
   <textarea id="myTextArea" rows="6" cols="50">
      Contrary to popular belief, Lorem Ipsum is not simply random text. 
      It has roots in a piece of classical Latin literature from 45 BC, 
      making it over 2000 years old.
   </textarea>
 </body>
 </html>

Answer 2

德德，

来自一些基本的谷歌搜索：D - ＆gt;

 <script type="text/javascript"> 
<!-- 

//myField accepts an object reference, myValue accepts the text strint to add 
function insertAtCursor(myField, myValue) { 
//IE support 
if (document.selection) { 
myField.focus(); 

//in effect we are creating a text range with zero 
//length at the cursor location and replacing it 
//with myValue 
sel = document.selection.createRange(); 
sel.text = myValue; 
} 

//Mozilla/Firefox/Netscape 7+ support 
else if (myField.selectionStart ¦¦ myField.selectionStart == '0') { 

//Here we get the start and end points of the 
//selection. Then we create substrings up to the 
//start of the selection and from the end point 
//of the selection to the end of the field value. 
//Then we concatenate the first substring, myValue, 
//and the second substring to get the new value. 
var startPos = myField.selectionStart; 
var endPos = myField.selectionEnd; 
myField.value = myField.value.substring(0, startPos)+ myValue+ myField.value.substring(endPos, myField.value.length); 
} else { 
myField.value += myValue; 
} 
} 

//--> 
</script>

使用按钮添加文字：

<textarea id="mytext" rows="8" cols="70"></textarea> 
<button onclick="insertAtCursor(document.getElementById('mytext'),'Test text')" valueAdd Test text>

希望它有助于你

C ya

使用JavaScript将输入字段文本插入textarea

2 个答案: