Я создаю функцию, которая объединяет 2 события в одном on методе управления, более удобном и удобном редактировании, например:
class EventManager {
constructor($el) {
this.$el = $el;
this.mainSwitch = false;
this.subSwitch = false;
this.condition = (!this.mainSwitch && !this.subSwitch); // false false then
this.condition2 = (!this.mainSwitch && this.subSwitch); // false true then
}
start(e) {
if (this.condition) {
console.log(e.type);
this.mainSwitch = true;
return false; // return keyword for end the function
} else if (this.condition2) {
this.mainSwitch = false;
this.subSwitch = false; // Go back to the default statement.
return false;
}
return false;
}
move(e) {
if (this.mainSwitch == true && this.subSwitch == false) {
console.log(e.type);
}
}
end(e) {
if (this.mainSwitch == true && this.subSwitch == false) {
console.log(e.type);
this.mainSwitch = false;
this.subSwitch = true;
}
}
apply() {
this.$el.on('touchstart mousedown', (e) => {
this.start(e);
})
$('html').on({
['touchmove mousemove']: (e) => this.move(e),
['touchend mouseup']: (e) => this.end(e)
})
}
}
var thatEvent = new EventManager($('#link'));
thatEvent.apply();
a {
width: 100%;
height: 100px;
border-radius: 10px;
background-color: brown;
font-family: Helvetica;
display: flex;
flex-flow: row;
justify-content: center;
align-items: center;
}
<a id="link" target="_blank" href="https://google.co.uk" draggable="false">
Click/Touch and Drag/Swipe
</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Я добавил логические флаги для пропуска определенного events group, равного mouseevents, потому что этот код запускается дважды, когда я touchэлемент.
Проблема в том, что логические флаги не пропускают событие mousedown, как я ожидал.После управления this.condition2 он откатывается для сравнения this.condition.А потом запускает console.log(e.type).
Сначала я подумал, что логические флаги могут пропустить event.Потому что я добавил ключевое слово return в каждые if разделы для отключения функции после выполнения сравнения.
Эта проблема приводит к тому, что событие mousedown будет отключено навсегда.Для использования события mousedown оба флага, this.mainSwitch и this.subSwitch должны быть установлены как falses, но после того, как я управляю touchstart, логические значения установлены как false и true, поэтому mousedown событие больше не может использоваться.
Есть ли способы пропустить событие, используя логические флаги в javascript?