7

重複の可能性:
.select() を使用して入力で選択されたものを選択解除する

ユーザーがjQueryを介して入力要素のテキストを選択解除したことを検出する方法はありますか?

（注：入力要素自体の「選択解除」、つまりぼかしの検出については質問していませんが、要素内のテキストについて質問しています。）

私がやっている

$('#input').select(function () {...}

ユーザーがテキストを選択したときに書式設定オプションを含むツールバーを表示しますが、ユーザーが選択をクリアしたかどうかを検出する方法を理解できませんでした。

助言がありますか？

4

3 に答える 3

5

ぼかしイベントを試す

$('#input').on('blur',function () {
    if( this.value == ''){
         alert('Blur Event - Text box Empty');
         //Your code here
     }
});

これは、入力フィールドがフォーカスを失うとすぐに起動します。未選択でした..

于 2012-10-03T22:42:33.587 に答える
3

これを検出する実際の JavaScript イベントはありません。ここでの最善の解決策は、blur、focus、keydown、および mousedown イベントの両方をチェックすることです。これは完璧ではありませんが、最も完全なソリューションです。.on メソッドを使用して、同時にすべてのイベントにバインドできます。

$("#input").select(function() {
    //do something here
});

$("#input").on("blur focus keydown mousedown", function() {
    //do something else here
});​

繰り返しますが、選択をクリアしなくてもぼかしイベントが発生する可能性があるため、これは完全な解決策ではありません。しかし、それはあなたができる最善のことです。

于 2012-10-03T22:59:08.330 に答える
3

それで、いくつかの実験の後、私は解決策を思いつきました。これが私がしたことです。ドキュメントから選択したテキストを返す関数を作成しました。

function getSelectedText() {
    return document.selection.createRangeCollection()[0].text;
}

ここから、イベントバインダーでjQueryを使用するCupOfTea696のソリューションを次のように適応させることができました。

$("#input").on("click change keyup select", function (event) {
     if(getSelectedText().length < 1)
          hideAppBar();
     else 
          showAppBar();
 });

だから私は基本的に選択したテキストの長さをチェックし、それに基づいてコンテキストメニューを表示または非表示にします。

ぼかしにはまだ問題がありますが、それは上記の解決策ではなく、AppBar で発生するクリック イベントに関係しています。また、これを Win8 でのみテストしたので、これが有効な Web ベースのソリューションになるかどうかはわかりませんが、なぜ機能しないのかわかりません。

于 2012-10-04T02:57:22.443 に答える