新しいブラウザでのみ動作するように設計された、非常に単純なRTEを最初から作成しています。
Operaを除いて、すべて正常に動作しますが、ツールバーを押したときにテキストの選択解除を停止することはできません。これが私の小さなプログラムの一部であるかどうか、または常に発生するかどうかをテストするための簡単なページを作成しました。
たとえば、いくつかのコードを使用してページを作成します。これは、Operaを除くすべての大きなブラウザで正常に機能します。
<p id="tmp">This text cannot be selected</p>
<p id="lispsum">Lorem ips...im id est laborum.</p>
<script type="text/javascript">
var el = document.getElementById('tmp');
el.addEventListener('mousedown', function(evt) {
evt.preventDefault();
}, false);
</script>
ChromeやFirefoxなどのブラウザでは、「lipsum」段落でテキストを選択してから「tmp」段落をクリックすると、選択が保持されます。Opera(バージョン12でテスト済み)では、選択を解除します。マウスを押したままにすると、カーソルを動かさない場合にのみ選択が解除されます。そのため、Operaでは、「非ドラッグ」(つまり、ロングクリック)と「クリックアンドドラッグ」の動作に違いがあります。
evt.stopPropagation()メソッドを試してみました。evt.returnValue= false; そしてfalseを返します。このようにハンドラーに追加されます:
el.addEventListener('mousedown', function(evt) {
if(evt.stopPropagation) evt.stopPropagation();
if(evt.preventDefault) evt.preventDefault();
if(evt.returnValue) evt.returnValue = false;
return false;
}, false);
次に、次のイベントに同じハンドラーを追加しました:mouseup、mousedown、mouseout、click、select、selectstart、selectchange。何も役に立たなかった。
また、jQueryメソッド「disableSelection()」を使用してみました。
$("#tmp").disableSelection();
ただし、動作は同じで、要素内のテキストは選択できませんが、その中をクリックすると、以前の選択がすべて解除されます。
他の誰かがこの問題に遭遇しますか?非常にイライラします。
編集:私のコメントをもう一度読んで、いくつかのテストを行うと、ロングクリックとクリックアンドドラッグの違いのために、「クリック」イベントに障害があるはずだと結論付けることができます。mouseupイベントはどちらの場合も発生しますが、クリックはカーソルが移動されていない場合(テキストが無視された場合)にのみ発生します。