4

jQueryがどれほど素晴らしくエレガントであるかについて、これらのすばらしい経験をすべて聞いたことがありますが、パフォーマンスが低いため、実際のプロジェクトにjQueryコントロールを実装しようとしています。今回はリチャードと同じような問題にぶつかっています。jQuery UI DatePickerは、私が取り組んでいるASP.NETアプリケーションでのユーザー受け入れテストに失敗しました。テキストボックスに入力しているときに、最後の2つの数値を入力するときに特に遅れが生じるためです。(例: '1/1/20 10 ')。

jQuery UIが、関連付けられているテキストボックスへのユーザーの入力を妨げるのを防ぐオプション/アプローチを知っている人はいますか?

4

2 に答える 2

3

IE 6でも同じ問題が発生しました。パフォーマンスツール(DynaTrace Ajax Edition)を使用してラグがどこにあるかを確認し、キーアップイベントで実行される更新日関数でそれを見つけました。したがって、私の回避策は、キーアップイベントを非アクティブ化することでした。

$( "#idOfTheInput" ).unbind("keyup");

編集:これを行うことには欠点があります。日付を手動で入力すると、日付ピッカーは更新されません。

したがって、別の(より良い?)解決策は、ユーザーがオプション付きの小さなボタンをクリックしたときにのみ日付ピッカーを表示することですshowOn: 'button'(詳細はこちら:http://jqueryui.com/demos/datepicker/#icon-trigger

次に、JQueryの日付ピッカーコードを変更して、日付ピッカーが表示されている場合にのみ日付を更新します。これを行うには、関数を見つけて、_doKeyUp「日付ピッカーが表示されている場合は更新を行い、そうでない場合は更新しない」という条件を追加します。

_doKeyUp: function(event) {
    var inst = $.datepicker._getInst(event.target);
    if ($.datepicker._datepickerShowing) {
        if (inst.input.val() != inst.lastVal) {
            try {
                var date = $.datepicker.parseDate($.datepicker._get(inst, 'dateFormat'),
                    (inst.input ? inst.input.val() : null),
                    $.datepicker._getFormatConfig(inst));
                if (date) { // only if valid
                    $.datepicker._setDateFromField(inst);
                    $.datepicker._updateAlternate(inst);
                    $.datepicker._updateDatepicker(inst);
                }
            }
            catch (event) {
                $.datepicker.log(event);
            }
        }
    }
    return true;
},

もちろん、プラグインのコードを変更するのは少し厄介です...

于 2011-03-23T11:08:22.877 に答える
3

Jasonが言ったことを拡張するために、これを行うことでベースUIファイルの外部のメソッドをオーバーライドできます

jQuery(function(){
  jQuery.datepicker._doKeyUp = function(event) {
    var inst = jQuery.datepicker._getInst(event.target);
    if(jQuery.datepicker._datepickerShowing) {
        if(inst.input.val() != inst.lastVal) {
            try {
                var date = jQuery.datepicker.parseDate(jQuery.datepicker._get(inst, 'dateFormat'),
                                                       (inst.input ? inst.input.val() : null),
                                                       jQuery.datepicker._getFormatConfig(inst));
                if(date) { // only if valid
                    jQuery.datepicker._setDateFromField(inst);
                    jQuery.datepicker._updateAlternate(inst);
                    jQuery.datepicker._updateDatepicker(inst);
                }
            }
            catch (event) {
                jQuery.datepicker.log(event);
            }
        }
     }
      return true;
    }
 }); 

.....。

于 2011-04-12T19:49:18.633 に答える