textarea在光标處插入一段文本

效果

實作

HTML:

<!-- 點選字型圖示在textarea中加入文本 --> 
<span @click="addPictureClic">
	<i class="fa fa-image" title="添加圖檔"></i>
</span>
<!-- ref="editorbox" 在方法中篩選出textarea --> 
<textarea class='editor-text' 
	ref="editorbox"  
	v-model="content"/>
           

methods:

methods:{
    addPictureClic(){
      this.addStringTOTextarea('# 我是插入的圖檔');
    },
   addStringTOTextarea(str){
    var tc = this.$refs.editorbox;
    var tclen = tc.value.length;
    tc.focus();
    if(typeof document.selection != "undefined")
    {
        document.selection.createRange().text = str;  
    }
    else
    {
        this.content = this.content.substr(0,tc.selectionStart)+str+this.content.substring(tc.selectionStart,tclen);
    }
   }
  }