在提交表单之前了解重点元素 ID

Knowing focused element id before submit form

提问人:mdromed 提问时间:11/4/2023 最后编辑:VLAZmdromed 更新时间:11/4/2023 访问量:29

问:

我想在ajax检查后将焦点返回到html元素(触发我的表单的提交)。因为我的表单总是被提交,所以最后一个焦点元素始终是提交按钮。

我怎么知道之前有焦点的 elemnt(请在纯 JS 中)?

提前致谢

JavaScript AJAX 焦点 表单 - 提交

评论


答:

1赞 DungGramer 11/4/2023 #1

若要将焦点返回到在 AJAX 检查后触发表单提交的 HTML 元素,可以使用 JavaScript 中的方法。可以在 AJAX 调用之前将具有焦点的上一个元素存储在变量中,然后在 AJAX 调用后使用它将焦点设置回该元素。focus()

例:

// Store the previously focused element
let previousElement = document.activeElement;

// Perform AJAX call
$.ajax({
  url: "your-url",
  success: function() {
    // Set focus back to the previously focused element
    previousElement.focus();
  }
});

若要在纯 JavaScript 中获取以前聚焦的元素,可以使用该属性。此属性返回文档中当前聚焦的元素。可以在 AJAX 调用之前将此值存储在变量中,然后在 AJAX 调用后使用它将焦点设置回该元素。document.activeElement

// Store the previously focused element
let previousElement = document.activeElement;

// Perform AJAX call
let xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    // Set focus back to the previously focused element
    previousElement.focus();
  }
};
xhr.open("GET", "your-url", true);
xhr.send();

评论

0赞 mdromed 11/4/2023
好的,谢谢你。。。我会尽快尝试
0赞 mdromed 11/4/2023
当我使用回车键提交表单时,document.activeElement 工作正常,但问题是当我在提交按钮上用鼠标执行 clic 时,document.activeElement 返回此按钮的 id。有什么想法吗?