javascript - 更改段落选择样式

标签 javascript jquery html css textselection

我是 JQuery 的新手,现在处境非常困难。 我需要让用户在一个段落中自由书写,然后根据需要更改文本颜色,但只能从他的段落中选择一个文本,就像在浏览器中编辑文本一样。 这是我的文件:
HTML

<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-5589-1" />
   <link rel="stylesheet" href="style_ext.css">
   <title>Editable Paragraph</title>
   </head>
   <body>
   <p contenteditable="true" class="par" id="txt">This is an editable paragraph.</p>
   <center>
           <button type="button" id="redText">Color text in red</button>
   </center>
   <center>
           <button type="button" id="blueText">Color text in blue</button>
   </center>
           <script type="text/javascript" src="js/jquery.js"></script>
           <script type="text/javascript" src="js/pushred.js"></script>
   </body>
</html>

CSS

.par {
    width: 300px;
    height: 300px;
    border: 2px solid #A3A3A3
}

JS

$('#redText').click(function() {
    change_color('red');
});


$('#blueText').click(function() {
    change_color('blue');
});

function change_color(theColor) {
    //What should I put here to make any selected text change the color ?
}

重要信息:我不想改变整个段落,只改变一个片段,一个选择,就像在文本编辑器中一样

最佳答案

$('#redText').click(function() {
    $(this).css('color', 'red');
};

关于javascript - 更改段落选择样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23833230/

相关文章:

jquery - 使用 Jquery 如何让 div 元素在页面加载时垂直和水平居中?

javascript - 如何将li中的内容附加到表单输入值javascript

javascript - Highchart 饼图垂直图例右对齐未固定以正确绘制

javascript - Safari 在 window.open 上显示弹出窗口

javascript - 如何在没有 eval 的情况下编写这段 JavaScript 代码(QUnit 模拟)?

javascript - 关闭所有通过委托(delegate)创建的打开的 Bootstrap 弹出窗口

jquery - 打字时改变 <p>

html - css word wrap 在不破坏它们的情况下包装整个单词?

javascript - 无法从 NodeList 获取值?

javascript - jquery/Dropzone.js 获取添加图片的当前索引