fix duplicate suggestion click events
This commit is contained in:
+23
-14
@@ -905,7 +905,8 @@
|
|||||||
|
|
||||||
if (suggestions.length) {
|
if (suggestions.length) {
|
||||||
this._appendSuggestions(suggestions, input);
|
this._appendSuggestions(suggestions, input);
|
||||||
this._registerSuggestionEvents();
|
this._registerSuggestionHighlightEvents();
|
||||||
|
this._registerSuggestionClickEvents();
|
||||||
$.bodyClassAdd('suggestions');
|
$.bodyClassAdd('suggestions');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -936,16 +937,23 @@
|
|||||||
this._suggestionEls = $.els('.js-search-suggestion');
|
this._suggestionEls = $.els('.js-search-suggestion');
|
||||||
}
|
}
|
||||||
|
|
||||||
_clearClickEvents() {
|
_clearSuggestionClickEvents() {
|
||||||
this._suggestionEls.forEach(el => {
|
this._suggestionEls.forEach(el => {
|
||||||
const callback = this._onClick.bind(null, el.value);
|
el.removeEventListener('click', this._onClick);
|
||||||
el.removeEventListener('click', callback);
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
_clearSuggestionHighlightEvents() {
|
||||||
|
this._suggestionEls.forEach(el => {
|
||||||
|
el.removeEventListener('mouseover', this._highlight);
|
||||||
|
el.removeEventListener('mouseout', this._unHighlight);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
_clearSuggestions() {
|
_clearSuggestions() {
|
||||||
$.bodyClassRemove('suggestions');
|
$.bodyClassRemove('suggestions');
|
||||||
this._clearClickEvents();
|
this._clearSuggestionHighlightEvents();
|
||||||
|
this._clearSuggestionClickEvents();
|
||||||
this._suggestionEls = [];
|
this._suggestionEls = [];
|
||||||
this._el.innerHTML = '';
|
this._el.innerHTML = '';
|
||||||
}
|
}
|
||||||
@@ -985,27 +993,30 @@
|
|||||||
|
|
||||||
_highlight(el, e) {
|
_highlight(el, e) {
|
||||||
this._unHighlight();
|
this._unHighlight();
|
||||||
|
if (!el) return;
|
||||||
if (el) {
|
|
||||||
this._onHighlight(el.getAttribute('data-suggestion'));
|
this._onHighlight(el.getAttribute('data-suggestion'));
|
||||||
el.classList.add('highlight');
|
el.classList.add('highlight');
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
_registerEvents() {
|
_registerEvents() {
|
||||||
document.addEventListener('keydown', this._handleKeydown);
|
document.addEventListener('keydown', this._handleKeydown);
|
||||||
}
|
}
|
||||||
|
|
||||||
_registerSuggestionEvents() {
|
_registerSuggestionClickEvents() {
|
||||||
|
this._suggestionEls.forEach(el => {
|
||||||
|
const value = el.getAttribute('data-suggestion');
|
||||||
|
el.addEventListener('click', this._onClick.bind(null, value));
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
_registerSuggestionHighlightEvents() {
|
||||||
const noHighlightUntilMouseMove = () => {
|
const noHighlightUntilMouseMove = () => {
|
||||||
window.removeEventListener('mousemove', noHighlightUntilMouseMove);
|
window.removeEventListener('mousemove', noHighlightUntilMouseMove);
|
||||||
|
|
||||||
this._suggestionEls.forEach(el => {
|
this._suggestionEls.forEach(el => {
|
||||||
const value = el.getAttribute('data-suggestion');
|
|
||||||
el.addEventListener('mouseover', this._highlight.bind(this, el));
|
el.addEventListener('mouseover', this._highlight.bind(this, el));
|
||||||
el.addEventListener('mouseout', this._unHighlight.bind(this));
|
el.addEventListener('mouseout', this._unHighlight.bind(this));
|
||||||
el.addEventListener('click', this._onClick.bind(null, value));
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -1014,14 +1025,12 @@
|
|||||||
|
|
||||||
_unHighlight(e) {
|
_unHighlight(e) {
|
||||||
const el = $.el('.highlight');
|
const el = $.el('.highlight');
|
||||||
|
if (!el) return;
|
||||||
if (el) {
|
|
||||||
this._onUnhighlight();
|
this._onUnhighlight();
|
||||||
el.classList.remove('highlight');
|
el.classList.remove('highlight');
|
||||||
if (e) e.preventDefault();
|
if (e) e.preventDefault();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
Reference in New Issue
Block a user