我正在使用在线富文本编辑器,类似于WordPress页面创建者或Stack Overflow后创建者.有人指出,有两种不同类型的在线富文本编辑器:
我正在构建第二种类型.不幸的是,<textarea>也没有使用contenteditable是HTML富文本编辑非常方便.
这个问题<textarea>(如在这里堆栈溢出使用)是你不能显示文本级语义在编辑栏.您不能只突出显示一个单词并使其变为粗体,您必须插入某种标记(例如*****bold*****).不是非常用户友好,也不是真正的"丰富"文本.
另一方面,使用contenteditable解决了这些问题但引入了控制问题.浏览器将插入各种HTML和CSS以使编辑字段看起来很好.如果你点击Enter,浏览器将插入<p>,或<div>,或<br>,或<div><br></div>...取决于浏览器.如果您粘贴从HTML复制的几个段落,您会得到大量过多的标记 - 甚至超过源HTML中的标记.例如,以下源代码:
<p>This is one paragraph!</p>
<p>This is another.</p>
在网站上显示为:
This is one paragraph!
This is another.
...如果你复制并粘贴到contenteditable表格中,可以给你这样的东西:
<p style="line-height: 1em; color: rgb(34, 34, 34); font-size: 12px;
white-space: normal;">This is one paragraph!</p>
<p style="line-height: 1em; color: rgb(34, 34, 34); font-size: 12px;
white-space: normal;">This is another.</p>
...带来内联样式,在某些情况下还有其他HTML.
wysiwyg richedit contenteditable rich-text-editor richeditabletext
I am trying to apply Bulleted list and Numbering list in android edit-text when user press button. For that i have tried below code.
For Bullet
BulletSpan[] quoteSpan = str.getSpans(selectionStart, selectionEnd, BulletSpan.class);
// If the selected text-part already has UNDERLINE style on it, then we need to disable it
for (int i = 0; i < quoteSpan.length; i++) {
str.removeSpan(quoteSpan[i]);
exists = true;
}
// Else we set UNDERLINE style on it
if (!exists) {
str.setSpan(new BulletSpan(10), selectionStart, selectionEnd, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); …当用户在contenteditable元素中插入换行符时，浏览器会将HTML 插入元素中。
以下是您[Enter]在各种浏览器中点击时得到的结果：
IE: <p></p>
Chrome: <div><br></div>
Safari: <div><br></div>
Firefox: <br />
Opera: <br />
（使用此 JSFiddle 演示自行测试。）
当用户没有插入任何 HTML 时，有没有办法让浏览器不插入 HTML？当然，我可以只使用
<textarea></textarea>
...这确实与我想要的非常相似，但是，我不想要严格的“纯文本”输入，因为我将使用 Javascript 在可编辑元素中添加和修改 HTML。
我考虑过在用户键入时不断剥离所有 HTML，只允许保留带有我创建的特殊类的 HTML。然而，这似乎不是一个很好的解决方案。是否有类似wrap='soft'或其他方式说“停止编写 HTML 并将其放入我的元素中！”
我有动态数据，我正在使用 ListView.builder 来显示用户。我只是使用文本向用户显示数据。只有我添加了一个编辑图标，所以当用户单击该图标时，它使用户能够编辑特定的文本。如何制作可编辑的 ListView 项目？