diff --git a/ui/dev/src/pages/components/button-prevent.vue b/ui/dev/src/pages/components/button-prevent.vue new file mode 100644 index 00000000000..b805ed8b79e --- /dev/null +++ b/ui/dev/src/pages/components/button-prevent.vue @@ -0,0 +1,32 @@ + + + diff --git a/ui/src/components/btn/QBtn.js b/ui/src/components/btn/QBtn.js index 9668a9d3eff..4acaffbc05b 100644 --- a/ui/src/components/btn/QBtn.js +++ b/ui/src/components/btn/QBtn.js @@ -155,46 +155,54 @@ export default Vue.extend({ }, __onKeydown (e) { - if (isKeyCode(e, [ 13, 32 ]) === true) { - stopAndPrevent(e) + this.$emit('keydown', e) + if (isKeyCode(e, [ 13, 32 ]) === true) { if (keyboardTarget !== this.$el) { keyboardTarget !== void 0 && this.__cleanup() - // focus external button if the focus helper was focused before - this.$el.focus() + if (e.defaultPrevented !== true) { + // focus external button if the focus helper was focused before + this.$el.focus() - keyboardTarget = this.$el - this.$el.classList.add('q-btn--active') - document.addEventListener('keyup', this.__onPressEnd, true) - this.$el.addEventListener('blur', this.__onPressEnd, passiveCapture) + keyboardTarget = this.$el + this.$el.classList.add('q-btn--active') + document.addEventListener('keyup', this.__onPressEnd, true) + this.$el.addEventListener('blur', this.__onPressEnd, passiveCapture) + } } - } - this.$emit('keydown', e) + stopAndPrevent(e) + } }, __onTouchstart (e) { + this.$emit('touchstart', e) + if (touchTarget !== this.$el) { touchTarget !== void 0 && this.__cleanup() - touchTarget = this.$el - const target = this.touchTargetEl = e.target - target.addEventListener('touchcancel', this.__onPressEnd, passiveCapture) - target.addEventListener('touchend', this.__onPressEnd, passiveCapture) - } - this.$emit('touchstart', e) + if (e.defaultPrevented !== true) { + touchTarget = this.$el + const target = this.touchTargetEl = e.target + target.addEventListener('touchcancel', this.__onPressEnd, passiveCapture) + target.addEventListener('touchend', this.__onPressEnd, passiveCapture) + } + } }, __onMousedown (e) { + this.$emit('mousedown', e) + if (mouseTarget !== this.$el) { mouseTarget !== void 0 && this.__cleanup() - mouseTarget = this.$el - this.$el.classList.add('q-btn--active') - document.addEventListener('mouseup', this.__onPressEnd, passiveCapture) - } - this.$emit('mousedown', e) + if (e.defaultPrevented !== true) { + mouseTarget = this.$el + this.$el.classList.add('q-btn--active') + document.addEventListener('mouseup', this.__onPressEnd, passiveCapture) + } + } }, __onPressEnd (e) {