focus 相关问题

Focus表示当前选择用于接收输入的图形用户界面的组件。

如何检查屏幕是否在选项卡堆栈中聚焦 - React Navigation

我正在创建一个使用 React Navigation 的 React Native 应用程序。在我的 1 个选项卡中，我有 3 个屏幕。如果我位于该选项卡中不是主屏幕的任何屏幕，并且我点击选项卡 ico...

react-native tabs react-navigation focus hook

回答 1 投票 0

即使点击输入之外的按钮，如何保持输入焦点

假设我有一个输入和一个按钮一些文字我想要那个onblur，它失去了...

javascript input focus onblur

回答 1 投票 0

如何应用：聚焦多个相同的选择器？

我试图在输入类型数字聚焦时更改底部边框颜色。我部分成功了，但 css 并未应用于所有选择器。问题是这样的：左侧（比索）不适合...

html css input bootstrap-4 focus

回答 3 投票 0

ANR 输入调度超时（服务器）未响应

在我的 Android 应用程序中，我随机遇到非常奇怪的崩溃。当我打开应用程序时，我正在启动屏幕上从服务器获取数据。当应用程序突然登陆主页时......

android events timeout focus android-anr-dialog

回答 2 投票 0

CSS 选择器：带有 tabindex 的锚点仍然无法聚焦

我的用例中有这个jsfiddle，其中隐藏的div应该显示另一个带有锚点的div是否获得焦点：https://jsfiddle.net/gimoya/skn2y3mx 我的用例中有这个jsfiddle，其中隐藏的div应该显示另一个带有锚点的div是否获得焦点：https://jsfiddle.net/gimoya/skn2y3mx <div tabindex="1" class="pop_gpx_text">🤝 <a>LINK</a> 🚩</div> <div class="kofi_reminder" id="hidden_div"> <a href="https://de.wikipedia.org/wiki/Test">Link 1</a> </div> .kofi_reminder {display: none; } .kofi_reminder:active { display:block; } .pop_gpx_text:focus + #hidden_div { display: block; } 目标是一旦单击锚点，隐藏的 div 就会显示并保持可见。现在，我奋斗了几个小时的问题是，在我的实现中，方法非常相同，焦点状态的伪选择器对锚标记内的文本没有影响。功能应该是，在我的地图中选择一条轨迹，然后单击弹出窗口中的“GPX 下载”链接后，应该显示隐藏的 div。 https://tiroltrailhead.com/legacy_trails/ 但是，只有当您聚焦/单击锚点“周围”的 div 内容而不是锚点本身时，隐藏的 div 才会显示。然而，这在 jsfiddel 中完美地工作 - 单击/聚焦 div 或/和锚点将适用于伪选择器... 确保您的锚点已将 href 设置为一个值，否则它将无法通过单击或键盘获得焦点。浏览器不会将没有 href 的锚点识别为交互元素。这样做，您的链接不需要 tabindex 包装： .box { display: inline-block; border: 1px solid; } .popup { display: none; } a:focus + .popup { display: block; } <div class="box"> <a href="#">Download</a> <div class="popup">More download info</div> </div>

css-selectors state focus anchor tabindex

回答 1 投票 0

将焦点设置在 div 内容可编辑元素上

我有一个，我用所见即所得的方式定义了一些元素。例如，等。我想直接将焦点放在这些元素之一上。例如... 我有一个 <div contenteditable=true>，我通过所见即所得定义了一些元素。例如<p>、<h1>等。我想直接将焦点放在其中一个元素上。例如<p id="p_test">。但似乎focus()功能不适用于<div>元素，<p>元素... 在我的案例中还有其他方法来定义焦点吗？旧帖子，但没有一个解决方案对我有用。不过我最终还是明白了： var div = document.getElementById('contenteditablediv'); setTimeout(function() { div.focus(); }, 0); 在现代浏览器中您可以使用： var p = document.getElementById('contentEditableElementId'), s = window.getSelection(), r = document.createRange(); r.setStart(p, 0); r.setEnd(p, 0); s.removeAllRanges(); s.addRange(r); 但是如果你的元素是空的我会遇到一些奇怪的问题所以对于空元素你可以这样做： var p = document.getElementById('contentEditableElementId'), s = window.getSelection(), r = document.createRange(); p.innerHTML = '\u00a0'; r.selectNodeContents(p); s.removeAllRanges(); s.addRange(r); document.execCommand('delete', false, null); 删除nbsp后光标停留在p元素内附注只是普通的空间不适合我我注意到 jQuery focus() 不适用于宽度和高度为 0 的 contenteditable DIV。我将其替换为 .get(0).focus() - 原生 javascript focus 方法 - 并且它有效。很多时候如果你无法在某个元素上调用 .focus()，那是因为 tabIndex 为 -1，这意味着当你按 Tab 导航时 Tab 键无法聚焦到该元素。将 tabIndex 更改为 >= 0 将使您专注于元素。如果您需要动态执行此操作，只需将 tabindex >= 0 添加到事件侦听器中的元素即可。你可以试试这个代码，它可以自动聚焦在你最后插入的位置。 let p = document.getElementById('contenteditablediv') let s = window.getSelection() let r = document.createRange() r.setStart(p, p.childElementCount) r.setEnd(p, p.childElementCount) s.removeAllRanges() s.addRange(r) 在@Surmon answer的基础上进一步构建。如果您希望在文本中的最后一个字母/数字而不是最后一个插入位置之后自动聚焦（如果子节点包含在块类型标签而不是纯文本中，则最后一个插入位置会将光标移动到新行）然后应用这个小修改： r.setStart(p.lastChild, 1); r.setEnd(p.lastChild, 1); 这是一个扩展函数，用于检查编辑器/元素是否有任何子节点，并根据情况在末尾相应地设置光标： let p = document.getElementById('contenteditablediv'); p.focus(); // alternatively use setTimeout(() => { p.focus(); }, 0); // this is enough to focus an empty element (at least in Chrome) if (p.hasChildNodes()) { // if the element is not empty let s = window.getSelection(); let r = document.createRange(); let e = p.childElementCount > 0 ? p.lastChild : p; r.setStart(e, 1); r.setEnd(e, 1); s.removeAllRanges(); s.addRange(r); } 如果有人使用管理 contenteditable 元素的 MediumEditor 偶然发现这个问题，以下内容对我有用： editor.selectElement(editorDOMNode); editor 是 MediumEditor 的实例。 editorDOMNode 是对实际 contenteditable DOM 节点的引用。还可以关注编辑器中的特定子节点，如下所示： editor.selectElement(editorDOMNode.childNodes[0]); 还有一件事需要检查：如果您打开了浏览器的控制台窗口，请确保加载页面时控制台没有焦点，否则页面上的元素将不会按预期获得焦点。这似乎也意味着您无法在控制台中运行 document.querySelector('#your-elem').focus()（于 2020 年 8 月在 Mac 上使用 Chrome、Safari 和 Firefox 进行了尝试）。请注意，click事件处理程序将需要单击一次来聚焦元素（不触发插入符号），然后再单击一次来触发插入符号。 setTimeout 和 .get(0) 等方法将无法按预期工作。使用 mousedown 事件处理程序只需使用 focus() 调用即可按预期工作。无需其他解决方法。在 Windows/Chrome（鼠标）和 Android/Chrome（触摸）上进行了测试。 jQuery 示例： const ns = { focus: e => { let el = $(e.currentTarget); el.focus(); } } $(document).ready(() => { $('body').on('mousedown', '[contenteditable]', ns.focus); //use mousedown instead of click }); [contenteditable] { border-bottom: 1px solid lightgray; /* prevents shifting on select */ line-height: 1.2em; } [contenteditable]:focus { border-bottom: 1px solid black; /* prevents slight visual shifting on select */ outline: 1px solid transparent; } [contenteditable=true]:empty:not(:focus):before { content: attr(placeholder) '...'; font-style: italic; font-size: .9em; text-transform: lowercase; opacity: .7; font-weight: normal; color: lightgray; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div contenteditable=true placeholder="edit me"></div> <div contenteditable=true placeholder="edit me, too"></div> 将“click”事件处理程序绑定到 contenteditable div 中的所有元素，并更改单击时的类/样式（即向元素添加“focused”类）；您可以通过添加彩色边框或内部框阴影等样式来向用户标识哪个元素具有焦点。然后，当您想要访问 jQuery 脚本中的焦点元素时，只需执行以下操作： var focused = $('.focused');

jquery focus contenteditable

回答 10 投票 0

如何使windll.user32.SetWinEventHook工作？

我正在尝试在 Windows 11、Python 3.11 中使用以下程序来挂钩焦点更改事件。导入 win32con 导入 pythoncom 从 ctypes 导入 wintypes、windll、WINFUNCTYPE # WinEventProc 和

python windows events focus hook

回答 1 投票 0

如何将焦点设置为独立于 id 的 HTML 表单中的第一个输入元素？

有没有一种简单的方法可以在加载页面时将网页的焦点（输入光标）设置在第一个输入元素（文本框、下拉列表等）上，而无需知道元素的 id？我会...

javascript html forms focus

回答 19 投票 0

将焦点设置在离开组合框时变得可见的下一个项目上

我有一个 ComboBox，其 AutoCompleteMode 设置为 Suggest。按顺序的下一个控件是 TextBox。根据组合框的选定项目，文本框可见或不可见。此外...