个人中心
文章发布
退出
作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用？
- database - RESTful URI 是否应该公开数据库主键？
26
4
我正在尝试开发一个允许用户为学校项目编写自己的笔记的网页，我的想法是让他们使用按钮将文本加粗/斜体化/下划线。截至目前，这些按钮可以正常工作，但它们会将文本区域内的所有内容加粗/斜体/加下划线。相反，我希望它以这样一种方式工作，即只有他们突出显示的文本才会变为粗体/斜体/下划线。我还想知道如何做到这一点，当他们单击粗体按钮时，他们从那时起输入的文本将显示为粗体，当他们再次单击它时，从那时起输入的文本将显示出来正常。
<script type="text/javascript">
function boldText(){
var target = document.getElementById("TextArea");
if( target.style.fontWeight == "bolder" ) {
target.style.fontWeight = "normal";
} else {
target.style.fontWeight = "bolder";
}
}
function italicText(){
var target = document.getElementById("TextArea");
if( target.style.fontStyle == "italic" ) {
target.style.fontStyle = "normal";
} else {
target.style.fontStyle = "italic";
}
}
function underlineText(){
var target = document.getElementById("TextArea");
if( target.style.textDecoration == "underline" ) {
target.style.textDecoration = "none";
} else {
target.style.textDecoration = "underline";
}
}
</script>
最佳答案
您可以使用 execCommand() .该 API 用于开发文本编辑器。这 3 个按钮使用非常通用的 execCommand() 并且书写元素是一个普通的 div，它启用了属性 contenteditable .
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<style>
:root {
font: 400 2ch/1.25 Consolas;
}
body {
font-size: 2ch
}
#editor {
height: 100px;
width: 375px;
margin: 10px auto 0;
}
fieldset {
margin: 2px auto 15px;
width: 375px;
}
button {
width: 5ex;
text-align: center;
padding: 1px 3px;
}
</style>
</head>
<body>
<fieldset id="editor" contenteditable="true">
The quick brown fox jumped over the lazy dog.
</fieldset>
<fieldset>
<button class="fontStyle" onclick="document.execCommand('italic',false,null);" title="Italicize Highlighted Text"><i>I</i>
</button>
<button class="fontStyle" onclick="document.execCommand( 'bold',false,null);" title="Bold Highlighted Text"><b>B</b>
</button>
<button class="fontStyle" onclick="document.execCommand( 'underline',false,null);" title='Underline Highlighted Text'><u>U</u>
</button>
</fieldset>
</body>
</html>关于javascript - 如何在 javascript 中使选定的文本变为粗体/斜体/下划线？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38218268/
26
4
0
执行此查询 INSERT INTO classes( '_fkUserID', 'date', 'time' ) VALUES ( '1', '2017-07-04', '8:15' ) 给
不知道它是否重复(无法找到要搜索的词，例如 “允许使用 java 字符”)。我在测试面试中遇到了这个问题: 考虑以下类: class _ {_ f; _(){}_(_ f){_ t = f; f =
我需要验证用户的屏幕名称以确保它不能有 多个连字符或下划线 我不希望人们的网名全是标点符号。 这是我到目前为止的验证: public boolean validateScreenName(String
我正在尝试检查我收到的新数据是否针对我持有的对象，我想知道的是，我正在发送的对象的键是否与我当前拥有的对象中的任何键匹配。 所以我捕获了一个像 myObj = [{"one": 1}, {"two":
这是我第一次使用下划线...我有这个简单的 json... "categories" : [ { "tag" : "cat1", "active" : true
一个很简单的问题: 为什么在WPF内容中看不到_(下划线)？ 例如内容 显示为"testt"(未显示下划线)。 最佳答案 标签支持助记符(即您可以使用ctrl +(key)赋予它们焦点)。您可以使用
下面是我正在处理的简化逻辑，我想在数组中查找具有匹配位置(文件夹)的文件。 我能够使用普通的 JS 循环来实现此功能，您能建议更好/更简单/类似下划线的方法来实现此类功能吗？ // source va
我正在尝试在对象的函数中查找和替换值 我的对象看起来像这样: var testStates = [{ "module": "module1", "customUrl": [
尝试让 _.uniq() 在以下结构上工作: [ {'x' : 1, 'y': 2}, {'x' : 1, 'y': 2}, {'x' : 2, 'y': 3}, {'
明白了: [{ "title": "qq", "dateValuePair": { "date": "2016-04-29T22:00:00.000Z", "va
我不知道这是否可能，但我试图做的是“清理”一个对象。基本想法是我有一个对象的表格(以 Angular )，然后单击我想添加一个新行(控制对象中的一个新项目，但我希望它没有值。我有下划线尝试一下。一些考
所以我有一大堆对象需要将其变成一个小对象。 它有 50-60 个对象，我需要过滤到一个新的对象数组中，其中只有 3 个。 所以看起来像 myOb = {{"ob1": 1},{"ob2": 1},{"
我有一个像这样的对象 - {"house" : red, "car" : green, "apple" : blue}; 并且正在发送另一个带有单个键/值的对象，如下所示 {"apple" : gre
我有一个包含多个对象的数组，例如 var val = [ _id: ["5412fc1bd123cf7016674a92", "5412cf270e9ca9b517b43ca3"],
所以我有一个对象列表，例如 var options = [{"car" : "red"},{"house": "green"},{"dog":"bark"}] 我正在尝试将其转换为一个值数组，
我正在尝试将此数组转换为对象。使用下划线，我想转换这个数组: [ { "id": "parentA", "children": [ { "nam
我正在尝试使用这样的链检索嵌套项目值。我正在遍历的对象如下所示: var testStates = [{ "module": "module1", "customUrl
我有一些内容可编辑的段落，我希望能够在双击时使某些单词加粗下划线。当我双击一个单词时，它会被选中，并显示一个包含 3 个选项的工具提示。但是，单击工具提示选项后，选择就会消失，并且文本不会发生任何更改
要在 CSS 中给文本加下划线，我们可以这样做: h3 {text-decoration:underline;} 然而，这只会强调包含在 h3 标签中的文本。如果想让下划线穿过页面怎么办？ 谢谢 最佳
我正在尝试解决我的最后一个问题，但我仍然不知道如何解决它。我的任务是编写一个对数字进行排序的程序，但是:我们的导师给了我们一些处理数字的程序的额外要点，例如:000054667(实际上是 54667)
我是一名优秀的程序员,十分优秀！