UiWebView中的contenteditable div - 单击done时不保存新行

Question

我有以下div UIWebView:

<div contenteditable="true"></div>

如果用户插入新行(使用可视键盘中的返回键),并且当他完成后,他点击上一个/下一个/完成灰色视觉键盘中的完成,它将行组合成一行.

我怎么能避免呢？

Answer 1

也许这个 JSFiddle可以让您了解应用程序中发生的情况。如果您在顶部 DIV（灰色背景色）中键入一些行，则作为其属性的返回值获得的 HTML 代码innerHTML将首先显示在textarea其下方的字段中（包括 HTML 标记格式）。正如您很快就会看到的，它不仅仅是您期望在应用程序中处理的内容（“第一行”+ CRLF +“第二行”...），而且还包含将行与另一行分隔开的 HTML 元素。这就是浏览器能够contenteditable像“备忘录”类型控件一样显示 DIV 的方式 - 通过解析它们的 HTML（这就是浏览器所做的）。这种 HTML 格式的文本也是您的应用程序接收用户提交的文本的方式，您必须决定如何处理这种格式。您可以将它们剥离（我怀疑，这就是您如何设置该对象的属性以及它为您处理的方式），用<DIV></DIV>空格字符替换 HTML 元素等，或者选择（使用您的控件的属性，或在代码中） ）来处理这种格式，无论您希望以哪种方式处理它们。我不熟悉UIWebView，但你必须自己找到如何检索完整的 HTML 格式的值，你想将这些值应用于你正在显示的下一个 DIV 元素（或者你分配新的相同的元素）值）。

更新：在网上搜索UIWebView参考后，我实际上偶然发现了一个相关的线程，它展示了如何检索底层 HTML 文档中元素的 innerHTML 值：

//where 'wView' is your UIWebView

NSString *webText = [wView stringByEvaluatingJavaScriptFromString:@"document.getElementById('inputDIV').innerHTML"];

这样，您就能够检索您在字符串变量中使用的 DIVinnerHTML中包含的整个字符串，并将其 HTML 格式的文本解析为更适合您需要的内容。但请注意，不同的浏览器在按下时会以不同的方式格式化 DIV ，有些浏览器会返回用新的 括起来的下一行，而另一些浏览器可能会将其括在段落中和/或以分隔符或结束行，当+一起使用时移动到下一行。在处理输入字符串时，您必须考虑所有这些可能性。请参阅我使用您的组件编写的 JSFiddle 脚本来检查适用的格式。contenteditablewebTextcontenteditableEnter KeyDIVP<BR><BR />shiftenterUIWebView

当然，就您的情况而言，将contenteditableDIV 替换为textarea会返回更常见格式的\n行尾 (CR+LF) 的 DIV 可能会更简单。然而 DIV 更容易设计，因此请选择更适合您需求的一个。

干杯!