关键词：
【中文标题】当点击网页上的任何链接或提交按钮时如何在 JavaScript 中检测【英文标题】：How to detect in JavaScript when any link or submit button is clicked on a webpage 【发布时间】：2022-01-20 19:30:39 【问题描述】：我有一个显示远程资产数据（例如气象站数据）的网页，它每 5 秒向我们的服务器执行一次后台 XMLHttpRequest()，并在收到来自远程资产的新数据时重新加载页面。多年来，这一切都运行良好。
该页面还有许多链接和提交按钮，可用于转到其他页面或向服务器提交命令（然后服务器向资产发送命令）。我遇到的问题是服务器随后执行的一些命令涉及对第 3 方 Web 服务的调用，其中一些有时可能需要长达 30 秒才能返回或超时。但与此同时，如果有新数据从资产中进来，后台 JS 函数会重新加载页面，从而中断并取消用户发起的新 http 请求。
我可以通过向每个链接添加 onclick 或 onsubmit 标记并提交按钮来调用一个函数来禁用计时器来解决这个问题，但由于页面上可能有几十个链接，我希望可能有一个更简单的链接，更优雅的方式，一个简单的函数可以告诉我用户是否点击了某个东西，从而启动了一个新的活动 http 会话。
我通过从 html 头部执行 setTimeout('myCheckServerFunction("'+url+'")',5000); 来启用我的脚本。如果服务器告诉它有新数据，它会执行setTimeout(function()location.reload();,5000);
因此，如果用户单击了任何链接或按钮，因此如果新的 http 会话处于活动状态，我想禁用 JS 计时器并防止任何重新加载。有没有这样的功能？例如。像“window.isNewHttpRequestActive()”这样的东西？或者也许有一种方法可以检查 window.location 是否发生了变化？ （不确定在新的 http 请求完成之前是否会更新。）
否则我可能会在每个链接上附加一个 addEventListener() 并在页面上提交按钮，但我是 PHP 开发人员而不是 JS，所以如果有人可以推荐解析 DOM 的最佳方法并将侦听器附加到每个链接和提交按钮也可以。
我确实尝试寻找“冒泡”到更高层的事件，例如。 body 元素，它会捕捉链接点击，但也会捕捉任何点击，即使只是点击任何空白区域，所以不确定它的效果如何，因为我仍然需要过滤该事件以确定它是否真的来自链接或按钮。谢谢。
【问题讨论】：
请编辑问题以将其限制为具有足够详细信息的特定问题，以确定适当的答案。 【参考方案1】：监听 body 上的所有点击事件不一定是个坏主意。
编辑：正如 gre_gor 在评论中指出的那样，它可能是。如果其他元素位于链接或按钮内部，则点击的感知目标并不总是链接或按钮。
所以要避免使用我原来使用event.target.tagName 的方法。
以下代码将在文档的每个 a 元素上为 click 添加一个事件侦听器，如果设置了计时器，您可以取消它：
for (let element of document.getElementsByTagName("a")
element.addEventListener("click", (event) =>
if (relocationTimeout !== undefined)
clearTimeout(relocationTimeout);
relocationTimeout = undefined;
);
由您来调整循环中的选择器以满足您的需求。
当然不要忘记在设置时将超时引用存储在变量中：
let relocationTimeout = setTimeout(function()location.reload();,5000)
【讨论】：
如果您单击其中的另一个元素，这将不起作用。例如<a href="#"><span>text</span></a>.
这对于作为一些测试的起点很有帮助，但是它不适用于按钮，因为这些按钮是作为来自“输入”元素的事件而 getElementsByTagName() 似乎不是能够区分不同的输入类型，例如文本框与提交按钮。因此，如果有人单击文本框，我会收到一个事件，但我只想知道是否有人单击了实际导致 http 请求的内容。谢谢
就指令而言，这可能是冗长而复杂的事情，但将document.getElementsByTagName("a") 替换为[].slice.call(document.getElementsByTagName("input")).filter(element => element.type === "/*input type here*/") 可以让您指定所需的输入标签类型。但此时最好手动为每个需要检查的元素指定一个特定的类，然后使用它。
您仍然可以收听所有点击事件。如果事件冒泡到a/button/input[type=submit]，您只需要向上移动 DOM 树即可。或者只是做event.target.matches("a, a *, button, button *, input[type=submit]")。
@gre_gor event.target.matches 很有帮助，因为它现在可以捕获对链接和按钮的所有点击。唯一的缺点是我有一些没有href（非活动链接）的标签，所以如果我点击其中一个标签，即使它们没有发起http请求，我仍然会收到一个事件。作为一个临时解决方案，我现在正在做的是使用 document.body.addEventListener() 获取事件以获取所有点击和提交事件（从正文 onload 调用），然后如果 target.matches 正如你所描述的那样，我只需重置我的计时器到 45 秒。这为任何新的 http 请求提供了足够的时间来完成。 ...java和htmlunit：如何点击提交按钮？
我是Java的新手，需要编写各种java应用程序来进行Web抓取和网页交互。我开始使用Selenium，但因为它直接与浏览器交互，所以我的使用不实用。我需要执行以下任务：1。转到特定URL2.在输入字段中输入邮政编码3.单击“提交”按钮... 查看详情
java中如何点击按钮跳转到网页（在浏览器中打开）
就像qq一样，在登入界面上，点击注册，它就跳到网页注册页面！不是超链接~！我们都用QQ，QQ页面上有“忘记密码”，“注册用户”这个选项吧！点开他们会进入到修改密码和注册的页面，是直接进入到默认浏览器的页面中..像... 查看详情
如何防止表单提交在字段上点击输入？ [复制]
】如何防止表单提交在字段上点击输入？[复制]【英文标题】：howtodopreventformsubmitfromhitenteronthefields?[duplicate]【发布时间】：2019-11-0518:19:38【问题描述】：当在任何输入字段表单上按回车键时，表单会被提交并调用AJAX。单击提交... 查看详情
Java 和 HTMLUnit：如何点击提交按钮？
】Java和HTMLUnit：如何点击提交按钮？【英文标题】：JavaandHTMLUnit:Howtoclickonsubmitbutton?【发布时间】：2013-04-1007:17:06【问题描述】：我是Java新手，需要编写各种Java应用程序来进行网页抓取和网页交互。我开始使用Selenium，但因为它... 查看详情
如何在点击vaadin画布上的提交按钮时填写文本？(代码片段)
我有一个画布，允许绘制边界框。在mouseDown函数中，将起始xy坐标作为对象和mouseUp侦听器推送到数组中，即当框的实际绘图发生时，一旦绘制它，它将访问相同的数组并编辑宽度和高度的值等。在我的MainLayout中，我有一个提交... 查看详情
淘宝网页的立即购买是如何触发的。（前段技巧）
...的标记。我很不理解，为什么这里链接到本页，而当我们点击的时候就进入了订单确认页，是JS在监视页面事件吗。我不是很理解，请朋友帮助给个思路。具体点更好参考技术A触发器 参考技术B触发器是怎么触发的? 查看详情
快速点击按钮时添加行或文本字段
】快速点击按钮时添加行或文本字段【英文标题】：AddrowortextfieldwhenButtontappedswift【发布时间】：2016-01-1107:26:40【问题描述】：我需要帮助。当点击视图上的自定义UI按钮时，如何在uiview或uitableview中添加新文本字段。当用户想要... 查看详情
java示例代码_每次点击提交按钮时，添加一个或增加整数
java示例代码_每次点击提交按钮时，添加一个或增加整数 查看详情
动态更改 CTA 按钮链接（在 iOS 或 Android 或网页上时）？
...-09-2901:34:11【问题描述】：我在桌面上有这个按钮-当用户点击它时，它会将他们带到下面的某个部分。但是我怎样才能更改按钮的链接，比如说-用户正在使用安卓手机，这个按钮的链接将更改为googleplay商店， 查看详情
当用户点击地址栏输入使用 JQuery 或 JS 时，如何防止网页重新加载
】当用户点击地址栏输入使用JQuery或JS时，如何防止网页重新加载【英文标题】：HowcanIpreventwebpagereloadingwhenauserclicksontheaddressbarenterusingJQueryorJS【发布时间】：2021-01-0122:05:25【问题描述】：当用户在地址栏上按Enter键时，我会阻止... 查看详情
在 iPhone 屏幕上的任意位置点击时关闭工具提示
】在iPhone屏幕上的任意位置点击时关闭工具提示【英文标题】：DismisstooltipontappinganywhereoniPhonescreen【发布时间】：2018-05-1120:46:17【问题描述】：我正在开发一个应用程序，在其中我在iOS应用程序上实现工具提示。在我的应用程序... 查看详情
网页提交，点击浏览器返回按钮，网页出错
...，所以写到一个php文件中，但是完成后进行测试，当一路点击提交代码结果显示正常，但是当问卷到第三页时点击浏览器返回按钮，网页直接报错，瞬间懵逼啊！没有任何日志！代码如下：<?phpif(!isset($_SESSION)){session_start();}$_SE... 查看详情
当网站响应或更改网页视图中的页面时，我们如何运行函数？
...述】：我的问题是，如果网站上有一个按钮，那么当用户点击它时，它就会出现在某个页面上。我想在显示信息时启用功能。请帮帮我。私有WebViewwebView；私有ProgressB 查看详情
使用jquery或javascript触发mousemove事件
嗨，我知道我们可以触发点击事件。但我想知道我们可以触发mousemove事件，而不会被用户实际移动鼠标。说明：我想在用户选择某些内容时显示一条消息。在画布上，我的画布具有完整的高度和宽度，当用户单击画布上显示的按... 查看详情
如何在单击提交按钮时获取复选框值？
...即name="recruiter_id"带有多个提交按钮。现在，当我点击第一行提交按钮时会发生什么提示数据但是当我点击最后一行提交按钮时会显示错误recruiter_id我不知道为什么？那么，如 查看详情
如何从提交按钮上的 TextBot 获取值？
...0:45:31【问题描述】：我正在创建一个将从QR码接收数据的网页。我是asp.Net的新手，我正在尝试从TextBox接收一个值并将其传递给SQL服务器。我怎样才能使用JavaScript或任何语言做到这一点？这是我的代码：我尝试使用以下命令执行... 查看详情
当用户单击“提交”按钮时将信息捕获到日志文件
...很好地处理许多数据库，例如mySQL。我的问题是，当网站上的用户单击“提交”按钮和管道时，是否有任何方法或代码可以实现，而无需 查看详情
如何在点击时创建新的 .html 网页？ [关闭]
】如何在点击时创建新的.html网页？[关闭]【英文标题】：HowdoIcreateanew.htmlwebpageonclick?[closed]【发布时间】：2015-11-2912:19:32【问题描述】：我想要做的是当用户单击我的html按钮时，我想在服务器上动态创建一个新网页。我需要新... 查看详情