使用小书签点击Gmail的“显示原创”按键 [英] Using a bookmarklet to click Gmail's "Show original" button

问题描述

当我在Gmail中打开一封电子邮件时，我试图以编程方式点击显示原始下拉菜单项。所有元素的ID随着每封电子邮件而动态变化，所以这不是一种可靠的方式来查找我尝试点击的菜单项。首先，我只是想制作一段JavaScript，在Chrome的控制台中点击它。加载jQuery后，我试过了这个：

When I have an email open in Gmail, I'm trying to click the "Show original" dropdown menu item programmatically. The IDs of all the elements change dynamically with each email, so that's not a reliable way to find the menu item I'm trying to click. To start, I'm just trying to make a piece of JavaScript that clicks it in Chrome's console. After loading jQuery, I've tried this:

jQuery('div[role=menuitem]:contains(Show original)').click();

虽然它似乎选择了正确的div并点击它，但这不是预期的行为，并且点击不会什么都不做。这是一个完整的电子邮件菜单，其中包含我想用JavaScript点击的菜单项：

While it seems to select the proper div and click it, it's not the expected behaviour and the click doesn't really do anything. Here's a piece of a fully loaded email's menu containing the menu item I'd like to click with JavaScript:

<div class="J-N" role="menuitem" aria-hidden="false" id="so" style="-webkit-user-select: none;"><div class="J-N-Jz"><div><div id=":173" class="cj" act="32"><img class="dS J-N-JX" src="images/cleardot.gif" alt="">Show original</div></div></div></div>

我的意图是使用书签，但由于安全警告而无法在书签中加载jQuery，但这是另一个问题。另外，我是否应该尝试在点击显示原始按钮之前打开下拉菜单，或者是否可以在不打开菜单的情况下点击此按钮？

My intention is to use a bookmarklet, but I'm having trouble loading jQuery in a bookmarklet because of a security warning, but that's another question/issue. Also, should I try to open the dropdown before clicking the "Show original" button or is it likely that I am able to click this button without opening the menu first?

推荐答案

您必须至少打开一次菜单，以便Gmail加载所需的菜单元素。

You must open menu at least once, so Gmail loads required menu elements.

要点击元素，请使用 dispatchEvent（）直接使用DOM元素（而不是jQuery集合）

To click on elements use dispatchEvent() straight on DOM elements (not jQuery collections)

基本示例可能如下所示：

Basic example might look like this:

// Create events
var mouseDownEvent = new MouseEvent('mousedown', { 'bubbles': true });
var mouseUpEvent = new MouseEvent('mouseup', { 'bubbles': true });

// Get DOM elements
var menu = jQuery("div[role='button'][aria-label='More']").get(0);
var button = jQuery("div[role='menuitem']:contains('Show original')").get(0);

// Open and close menu, to ensure button existence
menu.dispatchEvent(mouseDownEvent);
menu.dispatchEvent(mouseDownEvent);

// Click menu item
button.dispatchEvent(mouseDownEvent);
button.dispatchEvent(mouseUpEvent);

只适用于Chrome，Firefox和Opera。

That will work only in Chrome, Firefox and Opera.

这篇关于使用小书签点击Gmail的“显示原创”按键的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！