我需要将输入字段中的文本/字符串插入到已经包含一些文本的文本区域中.插入的字符串必须位于光标的位置,并且需要一个用于插入的按钮.
有没有办法用JavaScript完成这个？
Thx提前
PS应该插入的文本/字符串是使用PHP从数据库中获取的
@ Kamia的代码示例正确.这是您的测试的完整实现.根据您的描述,我假设在您的真实代码中,您可能会使用某些类型的查找来检索要添加到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>