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

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>

看看这个 fiddle :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