格式化<textarea>中的文本？

Question

由于一些内置功能(滚动条),Textareas很棒.我怎样才能<spans>在里面格式化文字<textarea>？

Answer 1

如果需要自定义textarea,请使用具有该contenteditable属性的其他元素(如DIV)重现其行为.

它更具可定制性,而且更现代化,textarea仅适用于纯文本内容,不适用于丰富内容.

<div id='fake_textarea' contenteditable></div>

可以使用CSS overflow属性重现滚动条.

您可以在正常的表单中使用此假textarea,即:如果您必须通过POST方法提交其内容,您可以执行类似的操作(使用jQuery):

<input type='hidden' id='fake_textarea_content' name='foobar' />

...

$('#your_form').submit(function()
{
  $('#fake_textarea_content').val($('#fake_textarea').html());
});

满足不是所有的poines和彩虹.这篇文章是一篇很棒的读物,我希望在尝试在我的一些项目中使用contenteditable之前我已经看过:https://medium.com/content-uneditable/contenteditable-the-good-the-bad-and-the-丑陋261a38555e9c#.v0d5rghdl.它似乎很好,但它有很大的缺陷. (6认同)

Answer 2

您不能单独设置文本区域的内容样式,您必须使用s或类似的东西.

你想要这样的东西:？

$('.editable').each(function(){
    this.contentEditable = true;
});

这允许你编辑div的内容,它仍然看起来像textarea,

大胆现在会工作.

[http://jsfiddle.net/XNkDx/2199/](http://jsfiddle.net/XNkDx/2199/)我刚刚添加了几行来向您展示这项工作的真实性.而且,+1为你我的朋友,漂亮的小脚本 (3认同)