テキスト要素を入力してSELECTの内容をフィルタリングできるコードが見つかりました。しかし、それはうまく動作しますが、時間の経過とともにパフォーマンスがかなり悪くなります。私はそれがフィルタコードかどうか、私がそれを起動しているかどうかはわかりません。テキストでフィルタのパフォーマンスが低下する問題を解決する方法
SELECTは、モーダルダイアログに表示(ブートストラップ)私は次のコードを持っている:
$('#myModal').on('shown', function() {
$(".focusable").val("").focus();
var select = $('#myModal').find(".modal-body").find("select");
var text = $('#myModal').find(".modal-body").find("input[type='text']");
select.filterByText(text, true);
});
そして、ここでのフィルタコードです:
jQuery.fn.filterByText = function (textbox, selectSingleMatch) {
return this.each(function() {
var select = this;
var options = [];
$(select).find('option').each(function() {
options.push({value:$(this).val(), text:$(this).text(), data:$(this).data("short-name")});
});
$(select).data('options', options);
$(textbox).bind('change keyup', function() {
var options = $(select).empty().data('options');
var search = $.trim($(this).val());
var regex = new RegExp(search, 'gi');
$.each(options, function (i) {
var option = options[i];
if (option.text.match(regex) !== null) {
var copyOption = $('<option>').text(option.text).val(option.value);
copyOption.data("short-name", option.data);
$(select).append(copyOption);
}
});
if (selectSingleMatch === true &&
$(select).children().length === 1) {
$(select).children().get(0).selected = true;
}
});
});
};
誰がどこにいくつかの光を当てることができます私のパフォーマンスの問題があり、それを解決する方法は?
変更とキーアップですべてのコードが実行されますか?したがって、すべての変更に対してRegExpとDOM操作を実行することは、かなりインフォーマルです...タイピングをやめた後に少し遅れて解決する方法はありますか? –
パフォーマンスにどのような影響があるのかを理解していますが、これは時間の経過とともにパフォーマンスが向上しています。ゲート性能上の問題ではありません。ダイアログが表示される最初の数回は、実際にはうまくいきます。 – Gregg
モーダルウィンドウが閉じているときにモーダルウィンドウの内容をリセットしますか?そうでない場合は、すべてのリスナーを保持します。ちょうどアイデア... –