2

在用户按下 CTRL+Home 时的 contenteditable 元素中，我试图让每个浏览器将插入符号位置移动到第一段的开头。

让我们假设整个页面都是可编辑的，除了手头的直接目标之外，我们不考虑其他任何事情。

这在 Firefox、Safari 和 IE 10 中运行良好，但 Opera 12 拒绝服从。这是代码...

var s = window.getSelection();

if (e.ctrlKey && e.keyCode==36)
{
 var p0 = document.getElementsByTagName('p')[0];

 if (p0.firstChild.nodeName.toLowerCase()=='#text')
 {//<p>text
  var p = p0.firstChild;
 }
 else if (p0.firstChild.firstChild.nodeName.toLowerCase()=='#text')
 {//<p><em>text
  var p = p0.firstChild.firstChild;
 }

 if (typeof p=='object')
 {
  s.getRangeAt(0).setStart(p,0);
  s.getRangeAt(0).setEnd(p,0);
  s.collapseToStart();
 }
}
4

1 回答 1

0

这个问题是由 Opera 中段落的 CSS 边距引起的。为什么？我完全不知道，只是这个最小的测试用例重现了它。

变通方法是主观的，边距和填充有不同的用途，在我的情况下，我无法使用填充代替边距，因此使我依赖 Opera 修复此错误。

例子.xhtml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Opera Contenteditable margin CTRL+Home/End Bug</title>
<style type="text/css">
p
{
 /*margin: 0px 20px 14px 24px;*/
 margin-top: 0px;
 margin-right: 20px;
 margin-bottom: 14px;
 margin-left: 24px;
}
</style>
</head>

<body>

<div contenteditable="true">
<p>Paragraph one.</p>
<p>Paragraph two.</p>
</div>

</body>
</html>
于 2012-06-24T21:16:28.663 回答