如何将文字追加到''?

时间:2021-03-17 13:57:22

I have <textarea> where user can type in his message to the world! Below, there are upload buttons... I would love to add link to uploaded file (don't worry, I have it); right next to the text that he was typing in.

我有

Like, he types in 'Hello, world!', then uploads the file (its done via AJAX), and the link to that file is added in next line to the content of <textarea>. Attention! Is it possible to keep cursor (place where he left to type) in the same place?

比如,他输入'Hello,world!',然后上传文件(通过AJAX完成),并在下一行添加到

All that may be done with jQuery... Any ideas? I know that there are method 'append()', but it won't be for this situation, right?

所有这些都可以用jQuery完成......有什么想法吗?我知道有方法'append()',但不会出现这种情况,对吧?

5 个解决方案

#1


13  

Try

var myTextArea = $('#myTextarea');
myTextArea.val(myTextArea.val() + '\nYour appended stuff');

#2


7  

This took me a while, but the following jQuery will do exactly what you want -- it not only appends text, but also keeps the cursor in the exact same spot by storing it and then resetting it:

这花了我一段时间,但是下面的jQuery将完全按照您的意愿执行 - 它不仅会附加文本,还会通过存储它然后重置它来将光标保持在完全相同的位置:

var selectionStart = $('#your_textarea')[0].selectionStart;
var selectionEnd = $('#your_textarea')[0].selectionEnd;

$('#your_textarea').val($('#your_textarea').val() + 'The text you want to append');

$('#your_textarea')[0].selectionStart = selectionStart;
$('#your_textarea')[0].selectionEnd = selectionEnd;

You should probably wrap this in a function though.

你应该将它包装在一个函数中。

#3


3  

You may take a look at the following answer which presents a nice plugin for inserting text at the caret position in a <textarea>.

您可以查看以下答案,该答案提供了一个很好的插件,用于在

#4


1  

You can use any of the available caret plugins for jQuery and basically:

您可以使用jQuery的任何可用插入符插件,基本上:

  1. Store the current caret position
  2. 存储当前的插入位置

  3. Append the text to the textarea
  4. 将文本附加到textarea

  5. Use the plugin to replace the caret position
  6. 使用插件替换插入位置


If you want an "append" function in jQuery, one is easy enough to make:

如果你想在jQuery中使用“append”函数,那么很容易做到:

(function($){
    $.fn.extend({
        valAppend: function(text){
            return this.each(function(i,e){
                var $e = $(e);
                $e.val($e.val() + text);
            });
        }
    });
})(jQuery);

Then you can use it by making a call to .valAppend(), referencing the input field(s).

然后,您可以通过调用.valAppend()来引用输入字段来使用它。

#5


1  

You could use my Rangy inputs jQuery plugin for this, which works in all major browsers.

您可以使用我的Rangy输入jQuery插件,适用于所有主流浏览器。

var $textarea = $("your_textarea_id");
var sel = $textarea.getSelection();
$textarea.insertText("\nSome text", sel.end).setSelection(sel.start, sel.end);

#1


13  

Try

var myTextArea = $('#myTextarea');
myTextArea.val(myTextArea.val() + '\nYour appended stuff');

#2


7  

This took me a while, but the following jQuery will do exactly what you want -- it not only appends text, but also keeps the cursor in the exact same spot by storing it and then resetting it:

这花了我一段时间,但是下面的jQuery将完全按照您的意愿执行 - 它不仅会附加文本,还会通过存储它然后重置它来将光标保持在完全相同的位置:

var selectionStart = $('#your_textarea')[0].selectionStart;
var selectionEnd = $('#your_textarea')[0].selectionEnd;

$('#your_textarea').val($('#your_textarea').val() + 'The text you want to append');

$('#your_textarea')[0].selectionStart = selectionStart;
$('#your_textarea')[0].selectionEnd = selectionEnd;

You should probably wrap this in a function though.

你应该将它包装在一个函数中。

#3


3  

You may take a look at the following answer which presents a nice plugin for inserting text at the caret position in a <textarea>.

您可以查看以下答案,该答案提供了一个很好的插件,用于在

#4


1  

You can use any of the available caret plugins for jQuery and basically:

您可以使用jQuery的任何可用插入符插件,基本上:

  1. Store the current caret position
  2. 存储当前的插入位置

  3. Append the text to the textarea
  4. 将文本附加到textarea

  5. Use the plugin to replace the caret position
  6. 使用插件替换插入位置


If you want an "append" function in jQuery, one is easy enough to make:

如果你想在jQuery中使用“append”函数,那么很容易做到:

(function($){
    $.fn.extend({
        valAppend: function(text){
            return this.each(function(i,e){
                var $e = $(e);
                $e.val($e.val() + text);
            });
        }
    });
})(jQuery);

Then you can use it by making a call to .valAppend(), referencing the input field(s).

然后,您可以通过调用.valAppend()来引用输入字段来使用它。

#5


1  

You could use my Rangy inputs jQuery plugin for this, which works in all major browsers.

您可以使用我的Rangy输入jQuery插件,适用于所有主流浏览器。

var $textarea = $("your_textarea_id");
var sel = $textarea.getSelection();
$textarea.insertText("\nSome text", sel.end).setSelection(sel.start, sel.end);