Question

我正在尝试实现一个将字体粗细更改为粗体的按钮。

我目前正在使用此代码

    $('#new_shout_bold').on('click', function() {
        $('.dash_new_shout_textarea').toggleClass('bold');
        return false; // prevent navigation to #
});

问题是，如果我要键入一些文本然后单击粗体按钮，所有以前的文本都会转换为粗体，我如何将上面的代码更改为仅用粗体写的文本而不是以前的文字？

由于

Answer 1

如果您使用的是contenteditable=true，则可以致电document.execCommand("bold", false, "");

 <input type="button" value="bold" 
                       onclick="document.execCommand('bold', false, '');"> 
 <div contenteditable="true">Can the text be in bold? Yes! 
                          mark and click the button! 
                          want to write in bold?
                          Click `bold` and start typing!</div>

看看这个小提琴：jsfiddle.net/SpacePineapple/u6Ew6

有关更多内置文字编辑选项，建议您熟悉本文：https://developer.mozilla.org/en/docs/Rich-Text_Editing_in_Mozilla

修改：另请参阅https://thenewcircle.com/s/post/1096/using_the_html5_attribute_contenteditable_to_create_a_wysiwyg以及https://thenewcircle.com/s/post/1096/samples/try4.htm处的示例

Jquery将所有文本更改为粗体而不是后续文本

1 个答案: