如图:

要实现点击asdfhjkl任意键唤起答题说明弹窗,弹窗唤起的情况下点击enter键关闭弹窗,无弹窗的情况下点击enter键直接开始挑战
 

onShow() {
			// #ifdef APP-PLUS
			plus.key.showSoftKeybord(); //唤起软键盘
			plus.key.addEventListener("keyup", this.keyEvent)
			// #endif
			// #ifdef H5
			document.addEventListener("keyup", this.keyEvent)
			// #endif
		},
		onHide() {
			// #ifdef APP-PLUS
			plus.key.removeEventListener("keyup", this.keyEvent);
			// #endif
			// #ifdef H5
			document.removeEventListener("keyup", this.keyEvent);
			// #endif
		},
		onBackPress() {
			// #ifdef APP-PLUS
			plus.key.removeEventListener("keyup", this.keyEvent);
			// #endif
			// #ifdef H5
			document.removeEventListener("keyup", this.keyEvent);
			// #endif
		},
methods:{
    keyEvent(e) {
				let _this = this;
				// #ifdef APP-PLUS
				console.log(e, '首页')
				if (e.keyCode == '29' || e.keyCode == '47' || e.keyCode == '32' || e.keyCode == '34' || e
					.keyCode == '36' || e.keyCode == '38' || e.keyCode == '39' || e.keyCode == '40') {
					_this.goRule() //唤起规则
				} else if (e.keyCode == '66' && !_this.isRule) {
					_this.goAnwser() //去答题
				} else if (e.keyCode == '66' && _this.isRule) {
					_this.knowEd() //关闭说明
				}
				// #endif
				// #ifdef H5
				console.log(e, '首页')
				if (e.key == 'a' || e.key == 's' || e.key == 'd' || e.key == 'f' || e
					.key == 'h' || e.key == 'j' || e.key == 'k' || e.key == 'l') {
					_this.goRule() //唤起规则
				} else if (e.key == 'Enter' && !_this.isRule) {
					_this.goAnwser() //去答题
				} else if (e.key == 'Enter' && _this.isRule) {
					_this.knowEd() //关闭说明
				}
				// #endif
			},

  }

事件说明链接:HTML5+ API Reference

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐