在 Cordova/Phonegap 下运行时，点击 contenteditable div 无法定位光标答案

【问题标题】：Tapping in contenteditable div fails to position cursor when running under Cordova/Phonegap在 Cordova/Phonegap 下运行时，点击 contenteditable div 无法定位光标
【发布时间】：2015-04-06 00:23:09
【问题描述】：

我有一个内容可编辑的 div，其中包含多行文本，使用 Cordova 在 iOS 和 Android 上运行。第一次点击 div 按预期将输入焦点移动到 div，但之后我遇到了一个重大问题......

通常我希望点击 contenteditable div 会将光标置于（或至少非常靠近）点击发生的位置。如果我只是使用 Mobile Safari 或 Android 的浏览器浏览到包含相同 contenteditable div 的网页，肯定会发生这种情况。但是当我在 Cordova 下运行它时，我发现不仅当我点击时光标没有正确定位，而且往往不是点击具有输入焦点的 contenteditable div 实际上会使它失去输入焦点！

可以用这样一个超级简单的例子来重现这个：

<div contenteditable="true">
    <div>line 1</div>
    <div>line 2</div>
</div>

任何帮助将不胜感激。我会扯掉我的头发，但这个策略有点晚了......我已经秃顶了。

我正在使用 MeteorJS，但怀疑这是问题的原因，因为在常规移动浏览器中浏览网站不会产生问题。

谢谢大家！

【问题讨论】：

标签： javascript ios cordova meteor phonegap-plugins

【解决方案1】：

我在 iOS 下遇到过类似这样的奇怪行为。尝试两件事：

让您的 contenteditable 元素更高。在一种情况下，我发现光标不能定位在元素的底部太近，但添加足够的 padding-bottom（实验）会使该内容“可达”。
将焦点设置在 touchstart 上的 contentEditable 元素上。见https://github.com/xing/wysihtml5/issues/98#issuecomment-35707207。 https://gist.github.com/shimondoodkin/1081133 看起来也很相关。

【讨论】：

嗨 - 谢谢你的回答！看来我的问题是由一个名为 Fastclick 的包引起的。我今天删除了它，contenteditable 开始表现自己。
您可能只想为您的 contenteditable 元素禁用 Fastclick（添加“needsclick”类），否则您将在整个应用程序中遇到烦人的点击延迟。

【解决方案2】：

问题似乎是由包含一个名为 Fastclick 的包引起的。一旦我删除它，点击似乎可以正常工作。

【讨论】：

FastClick 也给我造成了这个问题。关闭以检查他们的问题页面并查看有关升级它的信息。