Javascript 如何将文本附加到“<textarea>”?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6734579/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to append text to '<textarea>'?
提问by daGrevis
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.
我有<textarea>
用户可以向世界输入他的信息的地方!下面,有上传按钮......我很想添加上传文件的链接(别担心,我有);就在他正在输入的文本旁边。
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 完成),然后在下一行将指向该文件的链接添加到<textarea>
. 注意力!是否可以将光标(他留下打字的地方)保持在同一个地方?
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()',但它不会用于这种情况,对吗?
回答by James McCormack
Try
尝试
var myTextArea = $('#myTextarea');
myTextArea.val(myTextArea.val() + '\nYour appended stuff');
回答by fletom
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.
不过,您可能应该将其包装在一个函数中。
回答by Darin Dimitrov
You may take a look at the following answerwhich presents a nice plugin for inserting text at the caret position in a <textarea>
.
您可以查看以下答案,它提供了一个不错的插件,用于在<textarea>
.
回答by Brad Christie
You can use any of the available caret pluginsfor jQuery and basically:
- Store the current caret position
- Append the text to the textarea
- Use the plugin to replace the caret position
- 存储当前插入符号位置
- 将文本附加到 textarea
- 使用插件替换插入符号位置
If you want an "append" function in jQuery, one is easy enough to make:
如果你想要一个 jQuery 中的“追加”函数,一个很容易做到:
(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 itby making a call to .valAppend()
, referencing the input field(s).
然后您可以通过调用 来使用它.valAppend()
,引用输入字段。
回答by Tim Down
You could use my Rangy inputs jQuery pluginfor 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);