1

ユーザーが入力にフォーカスしているかどうかに基づいて、入力の表示を切り替えたい。ユーザーが入力を編集できるようにしたいのですが、ユーザーが移動したときに、編集した入力の代わりに入力を表示して、編集した入力を「フォーマット」します。

私の場合、2つの入力要素があります。「表示」入力は、ユーザーが「値」入力から離れたときに表示されます。次回ユーザーが「表示」入力フォーカスを与えるとき、ユーザーが値を入力できるように「値」入力フォーカスを与える必要があります。

jsFiddleをまとめました。エラーは、最初の入力に値を指定し、[ダミー入力]をクリックして現在の入力にフォーカスを失い、次に最初の入力をもう一度クリックすると、最初の入力がフォーカスを取得しなかったかのようになります。（クリックした直後はキーボードで何も入力できないことに注意してください）。繰り返しますが、これはIEの問題にすぎません。

注：移動後に最初の入力をクリックする代わりに、Tabキーを使用すると、機能します。クリックの問題だけのようです。

    <div>
  <label>Give me a value then give the value focus</label>
  <input id="valueInput" type="text" />
    <input id="displayInput" type="text" style="display:none;" />
  <br />
  <label>Dummy Input</label>
  <input type="text" />
</div>

$(window.document).on('blur', "#valueInput", function (e) {
  $(this).hide();
  $("#displayInput").show();
});

$(window.document).on('focus', "#displayInput", function (e) {
  $("#valueInput").show().focus();
  $(this).hide();
});

$("#valueInput").focus();

jQueryバージョン1.7.2

4

1 に答える 1

1

@Pointyのコメントと他のグーグルに基づいて、次のJavascriptで動作させることができました。

$(window.document).on('blur', "#downPaymentPercent", function (e) {
    $(this).hide();
    $("#downPaymentPercentDisplay").show();
});

$(window.document).on('focus', "#downPaymentPercentDisplay", function (e) {
  var $downPaymentPercent = $("#downPaymentPercent");
    $(this).hide();
  $downPaymentPercent.show();
  // IE work around since the focus call is delayed, set a timed out call
  window.setTimeout(function() {
    $downPaymentPercent.focus();
    // Set cursor to the end of the input
    $downPaymentPercent.val($($downPaymentPercent).val());
  }, 1);
});

$("#downPaymentPercent").focus();

これが動作するjsFiddleです

于 2013-01-16T05:17:27.797 に答える