考试宝答题界面优化

优化考试宝答题界面UI，增加按键绑定
目前为 2023-06-05 提交的版本。查看最新版本。
换行
// ==UserScript==
// @name        考试宝答题界面优化
// @namespace   https://github.com/AliubYiero/TemperScripts
// @version     1.1.2
// @description 优化考试宝答题界面UI，增加按键绑定
// @author      Yiero
// @match       https://www.zaixiankaoshi.com/online/*
// @icon        https://www.zaixiankaoshi.com/favicon.ico
// @license     GPL
// @grant       GM_addStyle
// ==/UserScript==
// 移除多余元素
// @ts-ignore
GM_addStyle(`
	.app-main {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 0;
	}
	
	.middle-container {
		padding: 10px ${16 + 19 + 16 + 10}px;
		border-radius: 10px;
	}
	
	.vip-quanyi, .new-footer, .header, .answer-box-detail,
	.answer-box-detail {
		display: none;
	}
	
`);
// @ts-ignore
window.onload = () => {
    // 判断是否为答题界面
    const localURL = document.URL.split('/');
    if (localURL[localURL.length - 2] !== 'online') {
        return;
    }
    /**
     * 多选题提交状态改变
     * @class
     * */
    class SubmitAnswerStatusChange {
        static isSubmit = false;
        /**
         * @static
         * 状态改变：提交
         * */
        static submit() {
            this.isSubmit = true;
        }
        /**
         * @static
         * 状态改变：取消提交
         * */
        static close() {
            this.isSubmit = false;
        }
        /**
         * @static
         * 状态改变：更新提交
         * */
        static fresh() {
            this.close();
        }
    }
    /**
     * 选项更新观察者类
     * @class
     * @extends MutationObserver
     * */
    class OptionObserver extends MutationObserver {
        constructor(Node, callback) {
            super(callback);
            super.observe(Node, {
                childList: true
            });
        }
    }
    // 更新选项
    let optionList = document.querySelectorAll('.options-w > .option');
    try {
        new OptionObserver(document.querySelector('.top-hd'), e => {
            // console.log( e );
            new OptionObserver(document.querySelector('.options-w'), e => {
                // console.log( 'Fresh Options: ' );
                // console.log( e );
                optionList = document.querySelectorAll('.options-w > .option');
            });
        });
    }
    catch (e) {
        // 获取不到题目卡片时刷新页面重新加载
        location.reload();
    }
    // 绑定键盘事件，让键盘点击可以选择选项，跳转题目
    window.addEventListener('keydown', e => {
        // console.log( e );
        const chosenOptionNumber = parseInt(e.key) - 1;
        // 选择选项
        // console.log( 'chosenOptionNumber' + chosenOptionNumber );
        // console.log( 'optionLength' + optionList.length );
        if (chosenOptionNumber >= 0 && chosenOptionNumber < optionList.length) {
            // console.log( 'Enter Option Chosen' );
            optionList[chosenOptionNumber]?.click();
            return;
        }
        /* 跳转题目 */
        const submitAnswer = document.querySelectorAll('.topic [style="clear: both;"]');
        if (submitAnswer.length === 2 && !SubmitAnswerStatusChange.isSubmit && ['Enter'].indexOf(e.key) !== -1) {
            // 提交多选答案
            SubmitAnswerStatusChange.submit();
            submitAnswer[0].querySelector('button').click();
            return;
        }
        SubmitAnswerStatusChange.fresh();
        if (['-', 'Backspace', 'ArrowLeft'].indexOf(e.key) !== -1) {
            // 上一题
            document.querySelector('.next-preve > button:nth-of-type(1)').click();
        }
        else if (['Enter', '+', '=', 'ArrowRight'].indexOf(e.key) !== -1) {
            // 下一题
            document.querySelector('.next-preve > button:nth-of-type(2)').click();
        }
    });
};
欢迎访问Greasy Fork镜像
