如何處理不觸發“點擊”事件的按鈕按下？

Question

所以我正在為 Google Classroom 編寫一個 Google Chrome 擴展程序。 這相當簡單：當您按下上交按鈕時，會彈出一個警告框，提醒用戶如果他們正在上交帶有家庭作業擴展的作業，請給他們的老師發送電子郵件。 這僅適用於經常忘記給老師發電子郵件的多動症朋友。

我讓 Chrome 擴展程序正常工作，因此它可以在正確的頁面上運行，找到對象，然后為單擊添加一個事件偵聽器。 我也為 keyDown 設置了這個設置，因為 Google 似乎采用了 ARIA。 當我使用document.querySelectorAll('[guidedhelpid="turnInButton"]')[0].click() ，它運行良好。 一切都按計划進行。 但是，當我實際單擊按鈕本身時，這不起作用。 我不知道該怎么做，因為我離 Web 開發人員很遠，我只是想幫助一個朋友。

筆記：

• 我確實注意到在jsaction它確實說preventMouseEvents ，但手動切換它似乎並沒有緩解問題。

檢查器.js

function remind() {
    alert("Don't forget to email your teacher if you need to use your homework extension!");
}

var t;
var x;

function checker() {
    x = document.querySelectorAll('[guidedhelpid="turnInButton"]')[0];

    if(x) {
        window.clearTimeout(t);
        x.addEventListener('click', remind);
        x.addEventListener('keyDown', remind);
    } else {
        t = window.setTimeout(checker, 100);

    }
}

checker();

清單文件

{
    "manifest_version": 2,

    "name": "******'s Remind Thingy",
    "description": "This is to remind ****** to email her teachers when she uses her homework extension.",
    
    "version": "1.0",

    "permissions": ["activeTab", "*://classroom.google.com/*"],

    "browser_action": {
        "default_icon": "images/icon_128.png"
    },

    "content_scripts": [
        {
            "run_at": "document_end",
            "matches": ["*://classroom.google.com/*/a/*"],
            "js": ["remind.js"]
        }
    ],

    "icons": {
        "16": "images/icon_16.png",
        "48": "images/icon_48.png",
        "128": "images/icon_128.png"
    }
}

我正在抓取的特定標簽

<div jsshadow="" role="button" class="uArJ5e TuHiFd UQuaGc Y5sE8d M9Bg4d" jscontroller="VXdfxd" jsaction="click:cOuCgd; mousedown:UX7yZ; mouseup:lbsD7e; mouseenter:tfO1Yc; mouseleave:JywGue;touchstart:p6p2H; touchmove:FwuNnf; touchend:yfqBxc(preventMouseEvents=true|preventDefault=true); touchcancel:JMtRjd;focus:AHmuwe; blur:O22p3e; contextmenu:mg9Pef" jsname="sFeBqf" aria-disabled="false" tabindex="0" guidedhelpid="turnInButton">
    <div class="Fvio9d MbhUzd" jsname="ksKsZd" style="top: 8px; left: 121.5px; width: 252px; height: 252px;"></div><div class="e19J0b CeoRYc"></div>
    <span jsslot="" class="l4V7wb Fxmcue">
        <span class="NPEfkd RveJvd snByac">Turn in</span>
    </span>
</div>

Answer 1

當role=button onsubmit 也被調用時：

function remind() {
    alert("Don't forget to email your teacher if you need to use your homework extension!");
return false;
}
...

 x.addEventListener('click',function(){ return remind();} );

或刪除role=button 。