0

ExtJS 4.1

次のような2つのテキストフィールドがあります。

                {
                    fieldLabel: 'Email',
                    name: 'email',
                    vtype: 'email',
                }, {
                    fieldLabel: 'Phone',
                    name: 'phone',
                    minLength: 8,
                    maxLength: 20,
                    value: '+7',
                },

ご覧のとおり、phoneフィールドには事前定義された値があります。

fileldの入力が終了しemailたら、Tabキーを押して次のフィールド（私の場合は-phoneフィールド）にフォーカスします。

フィールドがTabキーでフォーカスされている場合phone、カーソルは値の末尾（+7|）にありますが、フィールド内のすべてのテキストが選択されるため、何かを入力すると、すべてのテキストが新しいテキストに置き換えられます。

カーソルを値の文字列の最後に置きたいのですが、値のテキストは選択されません。

4

4 に答える 4

2

動作する回避策は次のとおりです。

{
    fieldLabel: 'Phone',
    name: 'phone',
    minLength: 8,
    maxLength: 20,
    value: '+7',
    listeners: {
        focus: function(field){
            var value = field.getValue();
            Ext.Function.defer(field.setRawValue, 1, field, [value]);
        }
    }
}

値が設定されているためにフィールドの最後にカレットを設定するページリフローを引き起こします。yaに対して機能するはずであり、変更イベントを引き起こしません。

于 2012-09-11T17:05:00.880 に答える
0

このように使用できます。

            {
                fieldLabel: 'Phone',
                name: 'phone',
                minLength: 8,
                maxLength: 20,
                value: '+7',
                listeners:{
                     focus:function(t,e){
                       t.selectText(t.getValue().length,t.getValue().length);
                     }
                }
            }
于 2012-09-11T13:33:03.443 に答える
0

Chromeの動作のようです。TABingの次のテキスト入力ですべてのテキストが自動的に選択されます。

投稿されたすべてのソリューションを試しましたが、Chromeでは効果がありません（OperaとMozillaは正常に動作します）。

お時間を割いていただきありがとうございます！

于 2012-10-08T12:38:17.293 に答える
0

この問題を解決するための鍵は、setTimeoutまたは@Reimiusの回答に類似したものを使用することです。

ChromeとIEは、を呼び出した場合でも、フォーカスされているすべてのテキストを選択しますevent.stopPropagation()。

考えられる解決策（一部のjQueryを使用）：

var selectText;

selectText = function(element, startIndex, endIndex) {
  var range;

  // Modern browsers, IE9+
  if (element.setSelectionRange != null) {
    element.selectionStart = startIndex;
    element.selectionEnd = endIndex;
    return;
  }

  // OldIE
  range = element.createTextRange();
  range.collapse(true);
  range.moveEnd('character', endIndex);
  range.moveStart('character', startIndex);
  range.select();
};

$(document).on('focus', 'input textarea', function(event) {
  setTimeout(function() {
    selectText(input, selectionStartIndex, selectionEndIndex);
  }, 0);
});
于 2014-04-14T11:39:31.030 に答える