1
私はChromeやSafariでは再生できたが、Firefoxでは再生できなかったWebアプリケーションに奇妙なバグが発生しました。DOM要素がわかりにくく表示されます
バグを確認するには、www.lastcalc.comにアクセスし、大文字を1つ入力してください。文字は、DIV.questionの "keydown"イベント（contentEditableがtrueに設定されたDIV）のリスナーを介して、白い "ボタン" cssで直ちに強調表示されます。これは、locutus.jsのhighlightSyntax関数によって実行され、Rangyライブラリに依存してハイライト中のカーソル位置を追跡します。
これまでのところ良い結果が得られましたが、現在は削除されています。それはわずかに異なるのChromeで
<div style="text-align: center;">
<font class="Apple-style-span" color="#606060">
<span class="Apple-style-span" style="font-size: 14px;">
<br/>
</span>
</font>
</div>
：
<div style="text-align: center;">
<font color="#606060">
<span style="font-size: 14px;">
<br/>
</span>
</font>
</div>
私の知る限りでは、私のコードではこれらの要素のいずれも作成されていませんが、現れています。私のコードで＃606060の色が言及されている唯一の場所は、 "white"クラスの定義のhighlighting.cssです。これはbackspaceを押すと削除された "span"要素に割り当てられたクラスです。
何らかの形で間違っているブラウザーブードゥーがあるようですが、誰かがこれを少し光らせてくれますか？
ps。もし誰かがこのウェブサイトが何であるか不思議であれば、あなたはもっと知ることができますhere。
編集：：これはbug in webkitである可能性がありますので、ここで問題は：どのように私はそれを回避することができますか？
AdBlockなどの実行中の拡張機能を無効にしましたか？ –
AdBlockなしで発生することが確認できます。私はChromeでさまざまな拡張機能を実行していますが、Safariでは拡張機能がありません。 – sanity
Chromeデベロッパーコンソールの[要素]タブでは、DOM要素を右クリックして[サブツリーの変更を中断]を選択できます。これは、テキストボックスに要素を追加するコードにブレークポイントを設定します。これにより、何が行われているのかがわかります。私はrangy-core.jsが何をしているのか分かりませんし、それが細分化されています。 – Jivings