8

エンドユーザーがHTMLドキュメントからテキストのセクションを選択して注釈を付けることができるWebベースの注釈ツールを構築しています。プログラム的に言えば、「window.getSelection」と「getRangeAt」を使用すると、選択したテキストと対応する範囲にアクセスして操作するのは簡単です。

しかし、クロスブラウザアプリケーションでこれらすべてをまとめようとすると、問題が発生します。Firefoxではすべてが機能しますが、Safariでは、HTMLボタン(つまり「注釈」ボタン)をクリックすると、ボタンをクリックするとテキストケアレットの位置が変更されたかのように、現在のユーザーテキストの選択が消えることにすぐに気付きました。window.getSelectionにアクセスしようとする私のコードは、このボタンのスクリプトから実行され、選択が存在しないことを報告します。

基本的に、テキストを選択して[太字]または[フォントの変更]をクリックする動作とメカニズムは注釈機能に対応しているため、Googleドキュメント、特にワープロアプリケーションがこれをどのように処理するかを掘り下げて調べました。Googleドキュメントでは、編集するドキュメントのテキストをiframeに読み込みます。これをいじってみると、Firefoxは、複数のフレームまたはiframeを含むWebページで複数の選択範囲をサポートしていることがわかりました。つまり、ベースページでテキストのセクションを選択し、最初の選択が消えることなくiframeでテキストの別のセクションを選択できます。このGoogleDocsソリューションは、FirefoxとSafari(私が興味を持っている2つのブラウザー)の両方で機能します。しかし、このソリューションをテストするための簡単なサンプルページを作成した場合、Safariでは機能しませんでした。

これを機能させるために私がここで欠けているものを誰かが知っていますか?または、これを機能させるための別の方法についての提案がありますか?

4

3 に答える 3

3

イベント ハンドラーをボタンの mousedown イベント (クリックまたは mouseup イベントではなく) にフックします。これにより、現在の選択をクリアする前に取得できます。

選択を変数に保存し、ボタンがクリック イベントを受け取った場合にのみ使用することで、ユーザー エクスペリエンスを維持できます。このような:

<button onmousedown="sel = window.getSelection()" onclick="alert(sel)">What's the selection?</button>
于 2009-03-31T13:08:42.020 に答える
2

Firefox はそのままで、複数のフレームを含む Web ページで複数の選択範囲をサポートすることを知りました

なんと、Firefox は 1 つのフレームで複数の選択をサポートしています。(クリックしてドラッグしてから、別のテキストで ctrl を押しながらクリックしてドラッグしてみてください。)

Safariでは、HTMLボタンをクリックすると、ボタンをクリックするとテキストキャレットが再配置されたかのように、現在のユーザーテキスト選択が消えることにすぐに気付きました

WindowsのSafari 3.2.1で動作します。<button>、<input type="button">、または <a> をクリックすると、別のフレームにある場合はグレー表示されますが、選択はそのまま残ります。「window.getSelection()」は引き続き通常どおり動作します。

テスト ケースと、どの Safari のバージョンで問題が発生するかを投稿できますか?

于 2009-03-23T20:01:13.263 に答える