我正在使用我正在处理的应用程序遇到一个奇怪的问题...每当用户突出显示已在页面上向下翻译的div上的文本时,浏览器将立即开始向上滚动.这很难描述,所以我做了一个展示问题的示例页面......
http://riskable.com/files/scroll_problem.html
我还将文本上传到pastebin以便于查看(如果我以后再删除该URL):
如果你 - 通过JavaScript - translate()将div1和div2都恢复到默认位置,问题就不会在div1中出现.它只发生在div2内部并且只在它位于用户面前时(例如它已被"translate()"转换).
老实说,我认为这可能是一个浏览器错误,但我不确定,因为我不是ECMAScript或DOM专家.有任何想法吗?
编辑:我已经更新了HTML以适用于Firefox 4+和Opera 11+(分别是-moz-transform和-o-transform).我还为更新的脚本创建了一个新的pastebin链接(链接已更新).这个问题似乎没有出现在这两种浏览器中,因此它似乎肯定是Chrome错误.
编辑2:我已在Chromium网站上针对此问题打开了错误报告:http: //code.google.com/p/chromium/issues/detail?id = 74318
它可能是Webkit中的一个错误,但我会让Chromium的人知道是否是这种情况.
我需要用 SPAN 标签将 HTML 元素内的各个单词包围起来。所以像这样:
Foo <span class="f1 b0">bar <b>baz</b> boo blah</span> lorem ipsum
Run Code Online (Sandbox Code Playgroud)
应该变成这样:
<span>Foo</span> <span class="f1 b0"><span>bar</span> <b><span>baz</span></b>
<span>blah</span></span> <span>lorem</span> <span>ipsum</span>
Run Code Online (Sandbox Code Playgroud)
原因是我希望能够使用“document.elementFromPoint(X, Y)”找出光标下的单词。我尝试使用一个简单的正则表达式:
theElement.innerHTML.replace(/\b(\w+)\b/g, "<span>$1</span>")
Run Code Online (Sandbox Code Playgroud)
...但这行不通,因为有问题的 HTML 元素内部肯定有元素。我只会在innerText而不是innerHTML上使用该正则表达式,但这样我就会丢失所有现有的格式。
我尝试过遍历该元素的子元素,对每个元素执行正则表达式替换,但有时子元素内有自己的 HTML 标签,我不知道如何替换标签之前或之后的文本。
有人有好的解决办法吗?