Javascript实现点击插入内容到textarea光标处
本文用JavaScript实现在textarea光标处插入指定文本内容以及字符串。
点击按钮，可以把按钮的内容插入到textarea文本框内光标处，光标默认在文本框开头。
通过其他的js就可以实现文本框插入表情、选中文字加粗、内容中插入图片等等。
>>>【演示地址】
HTML代码：
<formid="form1"name="form1"method="post"action="">
<label>
<textareaname="text"id="text"cols="45"rows="10">
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
这是测试内容，请在任意位置插入内容。
</textarea>
<aid="insert"href="javascript:void(0);">{PHPcodehere}</a>
</label>
</form>
Javascript代码：
<scripttype="text/javascript">
vartext=document.getElementById('text');
varinsert=document.getElementById('insert');
insert.onclick=function(){
insertAtCursor(text,this.innerHTML);
};
functioninsertAtCursor(myField,myValue){
if(document.selection){
//IEsupport
myField.focus();
sel=document.selection.createRange();
sel.text=myValue;
sel.select();
}elseif(myField.selectionStart||myField.selectionStart=='0'){
//MOZILLA/NETSCAPEsupport
varstartPos=myField.selectionStart;
varendPos=myField.selectionEnd;
varbeforeValue=myField.value.substring(0,startPos);
varafterValue=myField.value.substring(endPos,myField.value.length);
myField.value=beforeValue+myValue+afterValue;
myField.selectionStart=startPos+myValue.length;
myField.selectionEnd=startPos+myValue.length;
myField.focus();
}else{
myField.value+=myValue;
myField.focus();
}
}
</script>
参考资料：
- Inserttextintotextareaatcursorposition(Javascript)
- jquery在textarea光标处插入内容