繁体   English   中英

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

[英]Inserting input field text into textarea with JavaScript

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

有没有办法用JavaScript做到这一点?

提前Thx

PS使用PHP从数据库中获取应插入的文本/字符串

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

<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>

德德

从一些基本的谷歌搜索:D->

 <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>

希望对你有帮助

ç雅

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM