自动点击菜单

Greasy Fork is available in English.
自动点击菜单

自动点击菜单，支持按ID、类名、文本、位置自动点击，可设定执行次数
Ask a question, post a review, or report the script.
Wrap lines
// ==UserScript==
// @name         自动点击菜单
// @namespace    http://tampermonkey.net/
// @version      1.47.1
// @description  自动点击菜单，支持按ID、类名、文本、位置自动点击，可设定执行次数
// @author       YuoHira
// @license      MIT
// @match        *://*/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=github.io
// @grant        GM_setValue
// @grant        GM_getValue
// ==/UserScript==
 
class AutoClickMenu {
    constructor() {
        this.currentUrl = window.location.origin;
        this.autoClickEnabled = GM_getValue(`${this.currentUrl}_autoClickEnabled`, false);
        this.lastUpdateTime = new Map();
        this.menuItems = [];
        this.init();
    }
 
    init() {
        window.onload = () => {
            this.createStyles();
            this.toggleButton = new ToggleButton(this).createElement();
            this.menuContainer = this.createMenuContainer();
            this.addMenuTitle(this.menuContainer);
            this.saveButton = this.addButton(this.menuContainer, '保存', 'yuohira-button', (e) => {
                e.stopPropagation();
                this.saveData();
            });
            this.addButtonElement = this.addButton(this.menuContainer, '+', 'yuohira-button', (e) => {
                e.stopPropagation();
                this.addInputField();
            });
            this.toggleAutoClickButton = this.addButton(this.menuContainer, this.autoClickEnabled ? '暂停' : '开始', 'yuohira-button', (e) => {
                e.stopPropagation();
                this.autoClickEnabled = !this.autoClickEnabled;
                this.toggleAutoClickButton.innerText = this.autoClickEnabled ? '暂停' : '开始';
                GM_setValue(`${this.currentUrl}_autoClickEnabled`, this.autoClickEnabled);
            });
            this.inputContainer = document.createElement('div');
            this.menuContainer.appendChild(this.inputContainer);
            this.loadSavedData();
            this.applyAutoClick();
        };
    }
 
    createStyles() {
        const style = document.createElement('style');
        style.innerHTML = `
            .yuohira-button {
                background-color: #6cb2e8;
                border: 1px solid #0099cc;
                color: #fff;
                border-radius: 5px;
                padding: 5px 10px;
                cursor: pointer;
                font-size: 14px;
                margin: 5px;
                box-shadow: 0 0 10px #6cb2e8;
            }
            .yuohira-button:hover {
                background-color: #0099cc;
            }
            .yuohira-container {
                background-color: #b2ebf2;
                border: 1px solid #0099cc;
                border-radius: 10px;
                padding: 10px;
                box-shadow: 0 0 20px #6cb2e8;
                display: flex;
                flex-direction: column;
                align-items: center;
            }
            .yuohira-title {
                color: #0099cc;
                font-family: 'Courier New', Courier, monospace;
                margin-bottom: 10px;
            }
            .yuohira-input {
                border: 1px solid #0099cc;
                border-radius: 5px;
                padding: 5px;
                margin: 5px;
                background-color: #a0d3e0;
                color: #0099cc;
            }
            .yuohira-toggle-button {
                background-color: #6cb2e8;
                border: 1px solid #0099cc;
                color: #fff;
                border-radius: 50%;
                padding: 5px;
                cursor: pointer;
                font-size: 14px;
                width: 30px;
                height: 30px;
                position: fixed;
                top: 10px;
                right: 10px;
                z-index: 10001;
                opacity: 0.5;
                transition: opacity 0.3s;
                box-shadow: 0 0 10px #6cb2e8;
            }
            .yuohira-toggle-button:hover {
                opacity: 1;
            }
            .yuohira-input-wrapper {
                display: flex;
                align-items: center;
                margin-bottom: 5px;
                position: relative;
                padding-bottom: 18px;
            }
            .yuohira-progress-bar {
                height: 5px;
                position: absolute;
                bottom: 0;
                left: 0;
                background-color: #6cb2e8;
                clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
                border-radius: 2.5px;
            }
            .yuohira-warning {
                color: #e74c3c;
                font-size: 12px;
                position: absolute;
                left: 0;
                bottom: -13px;
                width: 100%;
                text-align: left;
                z-index: 2;
                pointer-events: none;
            }
            .yuohira-crosshair-overlay {
                position: fixed;
                top: 0; left: 0; right: 0; bottom: 0;
                z-index: 99999;
                pointer-events: auto;
                background: rgba(0,0,0,0.05);
            }
            .yuohira-crosshair-line {
                position: absolute;
                background: #e74c3c;
                z-index: 999999;
            }
            .yuohira-crosshair-label {
                position: absolute;
                background: #222;
                color: #fff;
                font-size: 12px;
                padding: 2px 6px;
                border-radius: 3px;
                z-index: 999999;
                pointer-events: none;
                transform: translateY(-150%);
            }
        `;
        document.head.appendChild(style);
    }
 
    createMenuContainer() {
        const menuContainer = document.createElement('div');
        menuContainer.className = 'yuohira-container';
        menuContainer.style.position = 'fixed';
        menuContainer.style.top = '10px';
        menuContainer.style.right = '10px';
        menuContainer.style.zIndex = '10000';
        menuContainer.style.display = 'none';
        document.body.appendChild(menuContainer);
        menuContainer.addEventListener('click', (e) => {
            e.stopPropagation();
        });
        return menuContainer;
    }
 
    addMenuTitle(container) {
        const menuTitle = document.createElement('h3');
        menuTitle.innerText = '自动点击菜单';
        menuTitle.className = 'yuohira-title';
        container.appendChild(menuTitle);
    }
 
    addButton(container, text, className, onClick) {
        const button = document.createElement('button');
        button.innerText = text;
        button.className = className;
        button.addEventListener('click', onClick);
        container.appendChild(button);
        return button;
    }
 
    loadSavedData() {
        const savedData = GM_getValue(this.currentUrl, []);
        savedData.forEach(item => {
            this.addInputField(item.type, item.value, item.enabled, item.interval, item.count);
        });
    }
 
    saveData() {
        const data = this.menuItems.map(item => item.getData());
        GM_setValue(this.currentUrl, data);
    }
 
    addInputField(type = 'id', value = '', enabled = false, interval = 1000, count = -1) {
        const menuItem = new MenuItem(type, value, enabled, interval, this, count);
        this.menuItems.push(menuItem);
        this.inputContainer.appendChild(menuItem.createElement());
    }
 
    applyAutoClick() {
        const autoClick = () => {
            if (this.autoClickEnabled && this.menuItems.some(item => item.isEnabled())) {
                const currentTime = Date.now();
                this.menuItems.forEach(item => item.autoClick(currentTime, this.lastUpdateTime));
            }
            requestAnimationFrame(autoClick);
        };
        requestAnimationFrame(autoClick);
    }
}
 
class MenuItem {
    constructor(type, value, enabled, interval, menu, count = -1) {
        this.type = type;
        this.value = value;
        this.enabled = enabled;
        this.interval = interval;
        this.menu = menu;
        this.count = (typeof count === "number" ? count : -1);
    }
 
    createElement() {
        const MIN_INTERVAL = 1;
        const inputWrapper = document.createElement('div');
        inputWrapper.className = 'yuohira-input-wrapper';
 
        this.select = document.createElement('select');
        const optionId = document.createElement('option');
        optionId.value = 'id';
        optionId.innerText = 'ID';
        const optionClass = document.createElement('option');
        optionClass.value = 'class';
        optionClass.innerText = '类名';
        const optionText = document.createElement('option');
        optionText.value = 'text';
        optionText.innerText = '文本';
        const optionPosition = document.createElement('option');
        optionPosition.value = 'position';
        optionPosition.innerText = '位置';
        this.select.appendChild(optionId);
        this.select.appendChild(optionClass);
        this.select.appendChild(optionText);
        this.select.appendChild(optionPosition);
        this.select.value = this.type;
        this.select.className = 'yuohira-input';
        inputWrapper.appendChild(this.select);
 
        this.input = document.createElement('input');
        this.input.type = 'text';
        this.input.value = this.value;
        this.input.className = 'yuohira-input';
        this.input.placeholder = 'ID/类名/文本/坐标';
        inputWrapper.appendChild(this.input);
 
        this.selectButton = document.createElement('button');
        this.selectButton.innerText = '选取';
        this.selectButton.className = 'yuohira-button';
        this.selectButton.addEventListener('click', (e) => this.selectElement(e));
        inputWrapper.appendChild(this.selectButton);
 
        this.select.addEventListener('change', () => {
            if (this.select.value === 'text') {
                this.selectButton.disabled = true;
                this.selectButton.style.backgroundColor = '#d3d3d3';
                this.selectButton.style.borderColor = '#a9a9a9';
                this.input.placeholder = '请输入文本';
            } else if (this.select.value === 'position') {
                this.selectButton.disabled = false;
                this.selectButton.style.backgroundColor = '';
                this.selectButton.style.borderColor = '';
                this.input.placeholder = '点击“选取”后屏幕定位';
            } else {
                this.selectButton.disabled = false;
                this.selectButton.style.backgroundColor = '';
                this.selectButton.style.borderColor = '';
                this.input.placeholder = '请输入ID/类名';
            }
        });
 
        if (this.type === 'text') {
            this.selectButton.disabled = true;
            this.selectButton.style.backgroundColor = '#d3d3d3';
            this.selectButton.style.borderColor = '#a9a9a9';
        }
 
        this.toggleInputClickButton = document.createElement('button');
        this.toggleInputClickButton.className = 'yuohira-button toggle-input-click-button';
        this.toggleInputClickButton.innerText = this.enabled ? '暂停' : '开始';
        this.toggleInputClickButton.setAttribute('data-enabled', this.enabled);
        this.toggleInputClickButton.addEventListener('click', (e) => {
            e.stopPropagation();
            const isEnabled = this.toggleInputClickButton.innerText === '开始';
            this.toggleInputClickButton.innerText = isEnabled ? '暂停' : '开始';
            this.toggleInputClickButton.setAttribute('data-enabled', isEnabled);
            this.warningMsg && (this.warningMsg.style.display = 'none');
        });
        inputWrapper.appendChild(this.toggleInputClickButton);
 
        const intervalWrapper = document.createElement('div');
        intervalWrapper.style.position = 'relative';
        intervalWrapper.style.display = 'inline-block';
        intervalWrapper.style.width = '100px';
        intervalWrapper.style.padding = '0px 140px 0px 0px';
 
        this.intervalInput = document.createElement('input');
        this.intervalInput.type = 'number';
        this.intervalInput.value = this.interval;
        this.intervalInput.className = 'yuohira-input';
        this.intervalInput.placeholder = '间隔';
        this.intervalInput.style.paddingRight = '10px';
        this.intervalInput.style.width = '100px';
        this.intervalInput.min = MIN_INTERVAL;
        this.intervalInput.addEventListener('input', () => {
            let val = parseInt(this.intervalInput.value, 10) || 0;
            if (val < MIN_INTERVAL) {
                val = MIN_INTERVAL;
                this.intervalInput.value = MIN_INTERVAL;
            }
            this.interval = val;
        });
        intervalWrapper.appendChild(this.intervalInput);
 
        const intervalSuffix = document.createElement('span');
        intervalSuffix.innerText = 'ms';
        intervalSuffix.style.color = '#0099cc';
        intervalSuffix.style.position = 'absolute';
        intervalSuffix.style.right = '10px';
        intervalSuffix.style.top = '50%';
        intervalSuffix.style.transform = 'translateY(-50%)';
        intervalSuffix.style.pointerEvents = 'none';
        intervalSuffix.style.zIndex = '1';
        intervalWrapper.appendChild(intervalSuffix);
 
        inputWrapper.appendChild(intervalWrapper);
 
        // ==== 新增：执行次数输入框 ====
        this.countInput = document.createElement('input');
        this.countInput.type = 'number';
        this.countInput.value = this.count;
        this.countInput.className = 'yuohira-input';
        this.countInput.style.width = '60px';
        this.countInput.style.marginLeft = '8px';
        this.countInput.placeholder = '-1为无限';
        this.countInput.title = '执行次数，-1为无限';
        this.countInput.addEventListener('input', () => {
            let val = parseInt(this.countInput.value, 10);
            if (isNaN(val)) val = -1;
            this.count = val;
        });
        inputWrapper.appendChild(this.countInput);
 
        const countLabel = document.createElement('span');
        countLabel.innerText = '次';
        countLabel.style.color = '#0099cc';
        countLabel.style.marginLeft = '2px';
        inputWrapper.appendChild(countLabel);
        // ==== 新增结束 ====
 
        this.progressBar = document.createElement('div');
        this.progressBar.className = 'yuohira-progress-bar';
        inputWrapper.appendChild(this.progressBar);
 
        // 警告信息
        this.warningMsg = document.createElement('div');
        this.warningMsg.className = 'yuohira-warning';
        this.warningMsg.style.display = 'none';
        inputWrapper.appendChild(this.warningMsg);
 
        const removeButton = document.createElement('button');
        removeButton.innerText = '-';
        removeButton.className = 'yuohira-button';
        removeButton.addEventListener('click', () => {
            inputWrapper.remove();
            this.menu.menuItems = this.menu.menuItems.filter(item => item !== this);
        });
        inputWrapper.appendChild(removeButton);
 
        return inputWrapper;
    }
 
    selectElement(event) {
        event.stopPropagation();
        if (this.select.value === 'position') {
            // 显示全屏十字准星
            this.showCrosshairSelector();
            return;
        }
        document.body.style.cursor = 'crosshair';
        this.selectButton.disabled = true;
 
        const hoverBox = document.createElement('div');
        hoverBox.style.position = 'fixed';
        hoverBox.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
        hoverBox.style.color = 'white';
        hoverBox.style.padding = '5px';
        hoverBox.style.borderRadius = '5px';
        hoverBox.style.pointerEvents = 'none';
        hoverBox.style.zIndex = '10002';
        document.body.appendChild(hoverBox);
 
        const mouseMoveHandler = (e) => {
            const elements = document.elementsFromPoint(e.clientX, e.clientY);
            elements.forEach((el) => {
                el.style.outline = '2px solid red';
            });
            document.addEventListener('mouseout', () => {
                elements.forEach((el) => {
                    el.style.outline = '';
                });
            });
 
            hoverBox.style.left = `${e.clientX + 10}px`;
            hoverBox.style.top = `${e.clientY + 10}px`;
            if (this.select.value === 'id' && elements[0].id) {
                hoverBox.innerText = `ID: ${elements[0].id}`;
            } else if (this.select.value === 'class' && elements[0].className) {
                hoverBox.innerText = `Class: ${elements[0].className}`;
            } else {
                hoverBox.innerText = '无ID或类名';
            }
        };
 
        const clickHandler = (e) => {
            e.stopPropagation();
            e.preventDefault();
            const selectedElement = e.target;
            if (this.select.value === 'id' && selectedElement.id) {
                this.input.value = selectedElement.id;
            } else if (this.select.value === 'class' && selectedElement.className) {
                this.input.value = selectedElement.className;
            }
            document.body.style.cursor = 'default';
            document.removeEventListener('mousemove', mouseMoveHandler);
            document.removeEventListener('click', clickHandler, true);
            this.selectButton.disabled = false;
            document.body.removeChild(hoverBox);
        };
 
        document.addEventListener('mousemove', mouseMoveHandler);
        document.addEventListener('click', clickHandler, true);
    }
 
    showCrosshairSelector() {
        // 创建全屏遮罩和十字准星
        const overlay = document.createElement('div');
        overlay.className = 'yuohira-crosshair-overlay';
 
        // 横线
        const hLine = document.createElement('div');
        hLine.className = 'yuohira-crosshair-line';
        hLine.style.height = '1px';
        hLine.style.width = '100vw';
        hLine.style.top = '50%';
        hLine.style.left = '0';
        hLine.style.background = '#e74c3c';
 
        // 竖线
        const vLine = document.createElement('div');
        vLine.className = 'yuohira-crosshair-line';
        vLine.style.width = '1px';
        vLine.style.height = '100vh';
        vLine.style.left = '50%';
        vLine.style.top = '0';
        vLine.style.background = '#e74c3c';
 
        // 坐标显示
        const label = document.createElement('div');
        label.className = 'yuohira-crosshair-label';
        label.innerText = '点击以选取位置';
        label.style.left = '50%';
        label.style.top = '50%';
 
        overlay.appendChild(hLine);
        overlay.appendChild(vLine);
        overlay.appendChild(label);
        document.body.appendChild(overlay);
 
        // 鼠标移动时更新准星位置和坐标
        const moveHandler = (e) => {
            hLine.style.top = `${e.clientY}px`;
            vLine.style.left = `${e.clientX}px`;
            label.style.left = `${e.clientX + 10}px`;
            label.style.top = `${e.clientY + 10}px`;
            label.innerText = `X: ${e.clientX}, Y: ${e.clientY}`;
        };
 
        overlay.addEventListener('mousemove', moveHandler);
 
        const clickHandler = (e) => {
            e.stopPropagation();
            e.preventDefault();
            this.input.value = `${e.clientX},${e.clientY}`;
            document.body.removeChild(overlay);
            overlay.removeEventListener('mousemove', moveHandler);
            overlay.removeEventListener('click', clickHandler);
        };
        overlay.addEventListener('click', clickHandler);
    }
 
    findElementsByText(text) {
        const elements = document.querySelectorAll('*');
        const matchingElements = [];
        elements.forEach(element => {
            if (element.textContent.trim() === text) {
                matchingElements.push(element);
            }
        });
        return matchingElements;
    }
 
    getData() {
        return {
            type: this.select.value,
            value: this.input.value,
            enabled: this.toggleInputClickButton.getAttribute('data-enabled') === 'true',
            interval: parseInt(this.intervalInput.value, 10),
            count: parseInt(this.countInput.value, 10)
        };
    }
 
    isEnabled() {
        return this.toggleInputClickButton.getAttribute('data-enabled') === 'true';
    }
 
    simulateMouseClick(element) {
        const rect = element.getBoundingClientRect();
        const x = rect.left + rect.width / 2;
        const y = rect.top + rect.height / 2;
        const opts = { bubbles: true, cancelable: true, clientX: x, clientY: y };
 
        element.dispatchEvent(new PointerEvent('pointerdown', opts));
        element.dispatchEvent(new MouseEvent('mousedown', opts));
        element.dispatchEvent(new PointerEvent('pointerup', opts));
        element.dispatchEvent(new MouseEvent('mouseup', opts));
        element.dispatchEvent(new MouseEvent('click', opts));        
    }
 
 
    autoClick(currentTime, lastUpdateTime) {
        if (typeof this.count !== 'number') this.count = -1;
        if (this.count === 0) return;
        if (!this.isEnabled()) return;
 
        const lastTime = lastUpdateTime.get(this) || 0;
        const elapsedTime = currentTime - lastTime;
 
        if (elapsedTime >= this.interval) {
            let elements = [];
            let inputVal = (this.input.value || '').trim();
            let clicked = false;
            if (this.select.value === 'id') {
                if (inputVal) {
                    elements = Array.from(document.querySelectorAll(`#${CSS.escape(inputVal)}`));
                }
            } else if (this.select.value === 'class') {
                if (inputVal) {
                    elements = Array.from(document.getElementsByClassName(inputVal));
                }
            } else if (this.select.value === 'text') {
                if (inputVal) {
                    elements = this.findElementsByText(inputVal);
                }
            } else if (this.select.value === 'position') {
                const pos = inputVal.split(',');
                if (pos.length === 2) {
                    const x = parseInt(pos[0].trim(), 10);
                    const y = parseInt(pos[1].trim(), 10);
                    if (!isNaN(x) && !isNaN(y)) {
                        const el = document.elementFromPoint(x, y);
 
                        if (el && !this.menu.menuContainer.contains(el)) {
                            elements = [el];
                        }
                    }
                }
            }
 
            if (this.select.value !== 'position') {
                elements.forEach(element => {
                    if (!this.menu.menuContainer.contains(element)) {
                        this.simulateMouseClick(element);
                        clicked = true;
                    }
                });
            } else if (elements.length > 0) {
                this.simulateMouseClick(elements[0]);
                clicked = true;
            }
 
            // 点击成功后减少次数
            if (clicked && this.count > 0) {
                this.count--;
                this.countInput.value = this.count;
            }
 
            // 异常提示处理
            if (this.select.value !== 'position') {
                if (inputVal && elements.length === 0) {
                    this.warningMsg.innerText = '未找到目标元素';
                    this.warningMsg.style.display = 'block';
                } else {
                    this.warningMsg.style.display = 'none';
                }
            } else {
                this.warningMsg.style.display = 'none';
            }
            this.progressBar.style.width = '100%';
            lastUpdateTime.set(this, currentTime);
        } else {
            let percent = (1 - elapsedTime / this.interval) * 100;
            if (percent < 0) percent = 0;
            if (percent > 100) percent = 100;
            this.progressBar.style.width = `${percent}%`;
        }
    }
}
 
class ToggleButton {
    constructor(menu) {
        this.menu = menu;
    }
 
    createElement() {
        const toggleButton = document.createElement('button');
        toggleButton.innerText = '>';
        toggleButton.className = 'yuohira-toggle-button';
        toggleButton.style.width = '15px';
        toggleButton.style.height = '15px';
        toggleButton.style.fontSize = '10px';
        toggleButton.style.textAlign = 'center';
        toggleButton.style.lineHeight = '15px';
        toggleButton.style.padding = '0';
        toggleButton.style.boxSizing = 'border-box';
        toggleButton.style.display = 'flex';
        toggleButton.style.alignItems = 'center';
        toggleButton.style.justifyContent = 'center';
 
        document.body.appendChild(toggleButton);
 
        toggleButton.addEventListener('click', (e) => {
            e.stopPropagation();
            if (this.menu.menuContainer.style.display === 'none') {
                this.menu.menuContainer.style.display = 'block';
                toggleButton.innerText = '<';
            } else {
                this.menu.menuContainer.style.display = 'none';
                toggleButton.innerText = '>';
            }
        });
 
        return toggleButton;
    }
}
 
(function () {
    'use strict';
    new AutoClickMenu();
})();