Question

实际行为：

问题是什么？ *点击满足时，页面会跳转。预期的行为是什么？它应该像输入字段一样，页面滚动到该元素。 CodePen（或重现问题的步骤）：*

CodePen演示，显示您的问题：http://codepen.io/pennybirman/pen/KaErKb

<body layout="column" ng-app="myApp" ng-cloak>
  <md-content>
    <div contenteditable="true" class="editables">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis, magni omnis ad nihil voluptate harum fuga aut voluptatum incidunt ut libero ex, itaque eligendi repellendus, impedit. Possimus blanditiis ex nam.</div>
    <div contenteditable="true" class="editables">Illum libero, praesentium quibusdam vitae, nam voluptatum earum doloribus deleniti magnam consequatur cum dolorem, eos? Blanditiis harum molestias recusandae officiis esse! Quia doloribus accusantium, recusandae illum debitis sunt laborum assumenda!</div>
    <div contenteditable="true" class="editables">Illum libero, praesentium quibusdam vitae, nam voluptatum earum doloribus deleniti magnam consequatur cum dolorem, eos? Blanditiis harum molestias recusandae officiis esse! Quia doloribus accusantium, recusandae illum debitis sunt laborum assumenda!</div>
    <div contenteditable="true" class="editables">Illum libero, praesentium quibusdam vitae, nam voluptatum earum doloribus deleniti magnam consequatur cum dolorem, eos? Blanditiis harum molestias recusandae officiis esse! Quia doloribus accusantium, recusandae illum debitis sunt laborum assumenda!</div>
    <div contenteditable="true" class="editables">Illum libero, praesentium quibusdam vitae, nam voluptatum earum doloribus deleniti magnam consequatur cum dolorem, eos? Blanditiis harum molestias recusandae officiis esse! Quia doloribus accusantium, recusandae illum debitis sunt laborum assumenda!</div>
    <div contenteditable="true" class="editables">Illum libero, praesentium quibusdam vitae, nam voluptatum earum doloribus deleniti magnam consequatur cum dolorem, eos? Blanditiis harum molestias recusandae officiis esse! Quia doloribus accusantium, recusandae illum debitis sunt laborum assumenda!</div>
    <div contenteditable="true" class="editables">Illum libero, praesentium quibusdam vitae, nam voluptatum earum doloribus deleniti magnam consequatur cum dolorem, eos? Blanditiis harum molestias recusandae officiis esse! Quia doloribus accusantium, recusandae illum debitis sunt laborum assumenda!</div>
  </md-content>
</body>

详细信息：必须在iOS移动设备中进行测试。（在browserStack中验证，xos与ios10验证）。角度版本：*

Angular Version：1.5.7 Angular材料版本：1.1.0 附加信息：

浏览器类型：* Safari mobile。

浏览器版本：* 10.0

操作系统：* iOS 10。

堆栈跟踪：没有错误，只有UI行为。

视频:: https://youtu.be/6U6BtxQggJ8

Answer 1

Justin（Ionic Team的支持工程师）表示不建议使用contenteditable div。来源：https://github.com/ionic-team/ionic/issues/4162（查看最新评论）

Contenteditable safari mobile，当设置焦点时，页面布局跳跃

1 个答案: