0

我正在开发一个可编辑的UIWebView应用程序。我首先使用 HTML 加载 Web 视图，该 HTML 由单个 DIV 和contenteditable=true. 我能够以编程方式强制此 DIV 关注这一行：

[self.webView stringByEvaluatingJavaScriptFromString:
    @"document.getElementById('maindiv').focus()"];

这会将光标置于 DIV 内容的开头，并根据需要显示键盘。

如果我构建初始 HTML 以便maindiv包含嵌套的内部 SPAN，如下所示：

<DIV ID="maindiv" contenteditable=true>This is some text to display. 
    <SPAN ID="innerspan">Hey, this is the text in the inner span</SPAN></DIV>

...然后我可以用这条线将焦点集中在这个内部跨度上：

[self.webView stringByEvaluatingJavaScriptFromString:
    @"document.getElementById('innerspan').focus()"];

在这种情况下，光标位于“嘿，这是...”之前，这是内部跨度内容的开始，所以这完全符合我的要求。

当我最初加载仅包含的 HTMLmaindiv然后动态插入innerspan; 在这种情况下，试图强迫焦点innerspan安静地失败。到目前为止，我尝试通过两种方式动态插入这个内部 SPAN：首先，使用document.execCommand('insertHTML' ...)和传递 SPAN 的代码；其次，通过使用document.createElement('span')and document.body.appendChild(var)。这两种方法都“有效”，因为它们确实将内部 SPAN 代码添加到文档中（通过 确认document.body.innerHTML），但似乎这些方法插入的 SPAN 无法以编程方式聚焦。

我怎样才能让我UIWebView识别这个动态添加的元素并让它接收焦点？

4

1 回答 1

0

要添加一些细节，事实证明，contentEditable = true如果外部 DIV 具有contentEditable = false. 这让事情变得有点棘手，因为首先需要外部 DIVcontentEditable = true才能添加嵌套的 SPAN。

所以诀窍是添加嵌套跨度，然后将外部 DIV 更改为contentEditable = false（这也将嵌套 SPAN 的可编辑性更改为false），然后将嵌套 SPAN 更改为contentEditable = true; 此时可以将焦点强制到嵌套的 SPAN。

[self.webView stringByEvaluatingJavaScriptFromString:
    @"document.execCommand('insertHTML', false, 
    '<span id=\"innerspan\">EDITABLE SPAN</span>')"];
[self.webView stringByEvaluatingJavaScriptFromString:
    @"document.getElementById('maindiv').contentEditable = false;"];
[self.webView stringByEvaluatingJavaScriptFromString:
    @"document.getElementById('innerspan').contentEditable = true;"];

// Force the focus to the newly-added SPAN:
[self.webView stringByEvaluatingJavaScriptFromString:
    @"document.getElementById('innerspan').focus()"];
于 2013-09-13T15:38:36.997 回答