Вставьте текст в текстовую область с jQuery

То, что вы просите, должно быть достаточно простым в jQuery-

$(function() {
    $('#myAnchorId').click(function() { 
        var areaValue = $('#area').val();
        $('#area').val(areaValue + 'Whatever you want to enter');
    });
});

Лучший способ, который я могу придумать для выделения вставленного текста, - это заключить его в диапазон с классом CSS с background-color установите цвет по вашему выбору. На следующей вставке вы можете удалить класс из любых существующих промежутков (или отделить промежутки).

Однако на рынке доступно множество бесплатных редакторов WYSIWYG HTML / Rich Text, я уверен, что один из них подойдет ваши потребности

• TinyMCE - Редактор JavaScript WYSIWYG
• Редактор форматированного текста - Библиотека YUI
• 10 Редакторы форматированного текста jQuery и не-jQuery JavaScript

have you tried:

$("#yourAnchor").click(function () {
    $("#yourTextarea").val("your text");
});

not sure about autohighlighting, though.

EDIT:

To append:

$("#yourAnchor").click(function () {
    $("#yourTextarea").append("your text to append");
});

I use this function in my code:

$.fn.extend({ insertAtCaret: function(myValue) { this.each(function() { if (document.selection) { this.focus(); var sel = document.selection.createRange(); sel.text = myValue; this.focus(); } else if (this.selectionStart || this.selectionStart == '0') { var startPos = this.selectionStart; var endPos = this.selectionEnd; var scrollTop = this.scrollTop; this.value = this.value.substring(0, startPos) + myValue + this.value.substring(endPos,this.value.length); this.focus(); this.selectionStart = startPos + myValue.length; this.selectionEnd = startPos + myValue.length; this.scrollTop = scrollTop; } else { this.value += myValue; this.focus(); } }); return this; } });

input{width:100px} label{display:block;margin:10px 0}

 Copy text from:  Insert text in:  Insert

It's not 100% mine, I googled it somewhere and then tuned for mine app.

Usage: $('#element').insertAtCaret('text');

этот позволяет вам «вставлять» фрагмент текста в текстовое поле, вводить означает: добавляет текст туда, где находится курсор.

function inyectarTexto(elemento,valor){
 var elemento_dom=document.getElementsByName(elemento)[0];
 if(document.selection){
  elemento_dom.focus();
  sel=document.selection.createRange();
  sel.text=valor;
  return;
 }if(elemento_dom.selectionStart||elemento_dom.selectionStart=="0"){
  var t_start=elemento_dom.selectionStart;
  var t_end=elemento_dom.selectionEnd;
  var val_start=elemento_dom.value.substring(0,t_start);
  var val_end=elemento_dom.value.substring(t_end,elemento_dom.value.length);
  elemento_dom.value=val_start+valor+val_end;
 }else{
  elemento_dom.value+=valor;
 }
}

И вы можете использовать его так:

<a href="javascript:void(0);" onclick="inyectarTexto('nametField','hello world');" >Say hello world to text</a>

Забавно и имеет больше смысла, когда у нас есть функция «Вставить тег в текст».

работает во всех браузерах.

Я использовал это, и он отлично работает :)

$("#textarea").html("Put here your content");

Реми

Мне нравится расширение функции jQuery. Однако this относится к объекту jQuery, а не к объекту DOM. Поэтому я немного изменил его, чтобы сделать его еще лучше (можно обновлять сразу в нескольких текстовых полях / текстовых полях).

jQuery.fn.extend({
insertAtCaret: function(myValue){
  return this.each(function(i) {
    if (document.selection) {
      //For browsers like Internet Explorer
      this.focus();
      var sel = document.selection.createRange();
      sel.text = myValue;
      this.focus();
    }
    else if (this.selectionStart || this.selectionStart == '0') {
      //For browsers like Firefox and Webkit based
      var startPos = this.selectionStart;
      var endPos = this.selectionEnd;
      var scrollTop = this.scrollTop;
      this.value = this.value.substring(0, startPos)+myValue+this.value.substring(endPos,this.value.length);
      this.focus();
      this.selectionStart = startPos + myValue.length;
      this.selectionEnd = startPos + myValue.length;
      this.scrollTop = scrollTop;
    } else {
      this.value += myValue;
      this.focus();
    }
  });
}
});

Это действительно хорошо работает. Вы можете вставить сразу в несколько мест, например:

$('#element1, #element2, #element3, .class-of-elements').insertAtCaret('text');