回答編集履歴

1

コードを載せる

2017/09/26 05:22

投稿

x_x
x_x

スコア13749

test CHANGED
@@ -1,3 +1,91 @@
1
1
  以前似たような質問がありました。これで解決するでしょうか?
2
2
 
3
3
  [https://teratail.com/questions/79463](https://teratail.com/questions/79463)
4
+
5
+
6
+
7
+ -- 9/26 14:15 追記
8
+
9
+
10
+
11
+ jquery-uiの_scrollIntoViewに問題があるのはわかっているので、直接スクリプトを変更する手を思いつきます。
12
+
13
+ (jquery-ui-1.12.1.js 5332-5334行目をコメントアウト)
14
+
15
+ ```JavaScript
16
+
17
+ if ( offset < 0 ) {
18
+
19
+ // this.activeMenu.scrollTop( scroll + offset );
20
+
21
+ // } else if ( offset + itemHeight > elementHeight ) {
22
+
23
+ // this.activeMenu.scrollTop( scroll + offset - elementHeight + itemHeight );
24
+
25
+ }
26
+
27
+ ```
28
+
29
+
30
+
31
+ ただこれは.min.jsが使えない・バージョンアップが面倒という問題があるので以前のように書き換えてみます。
32
+
33
+ ```JavaScript
34
+
35
+ $.widget('ui.autocomplete2', $.ui.autocomplete, {
36
+
37
+ _create: function() {
38
+
39
+ $.ui.autocomplete.prototype._create.apply(this, arguments);
40
+
41
+ this._createAutocomplete();
42
+
43
+ },
44
+
45
+ _createAutocomplete: function() {
46
+
47
+ // var menu = $(this.input.autocomplete("widget")).data("ui-menu");
48
+
49
+ var menu = this.menu;
50
+
51
+ var originalScrollIntoView = menu._scrollIntoView;
52
+
53
+ menu._scrollIntoView = function (item) {
54
+
55
+ if (this._hasScroll()) {
56
+
57
+ borderTop = parseFloat($.css(this.activeMenu[0], "borderTopWidth")) || 0;
58
+
59
+ paddingTop = parseFloat($.css(this.activeMenu[0], "paddingTop")) || 0;
60
+
61
+ var offset = item.offset().top - this.activeMenu.offset().top - borderTop - paddingTop;
62
+
63
+ if (offset < 0) {
64
+
65
+ // Glitchy 'offset', do nothing.
66
+
67
+ return;
68
+
69
+ }
70
+
71
+ }
72
+
73
+
74
+
75
+ originalScrollIntoView.apply(this, arguments);
76
+
77
+ }
78
+
79
+ }
80
+
81
+ });
82
+
83
+ ```
84
+
85
+ ```JavaScript
86
+
87
+ // 変更したほうを呼ぶ。
88
+
89
+ $('#code').autocomplete2();
90
+
91
+ ```