个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
27
4
我有一个带有多个文本字段的自定义表单。所有这些元素都有一个 tabindex值集。但是，一旦我放置了新的验证码，就无法访问该复选框，因为它的 tabindex 设置为默认值 0。有没有办法为新的验证码复选框设置选项卡索引？
下面的代码演示了这个问题:
<script src="https://www.google.com/recaptcha/api.js"></script>
<form action="" method="POST">
<input type="text" name="username" tabindex="1" autofocus>
<input type="password" name="password" tabindex="2">
<div class="g-recaptcha" data-sitekey="[SITE KEY]"></div>
<input type="submit" value="Login" tabindex="4">
</form>
<script>来自
<head> .
最佳答案
昨天我花了大量时间调试 reCAPTCHA 2 API 以寻找未记录的功能，而且我有理由确定 Google 没有提供 API 来执行此操作。
但是，您需要做的就是设置 tabindex iframe 上的属性生成的元素。 Google 将其设置为 0默认情况下，但我们没有理由不能更改它。 iframe不会立即生成，因此您需要先等待它渲染。
另外，如果我们可以指定 tabindex 就好了。我们要在 .g-recaptcha元素，在类似 data-tabindex 的属性中.
这是一个很好的小片段，它循环了 .g-recaptcha。 , 为 iframe 添加事件监听器为 load事件(使用捕获阶段，因为事件不会冒泡)，并设置 tabIndex iframe 的属性(property)到 data-attribute 的值属性。只需将此脚本包含在您网页的页脚中，或在准备好文档时运行它。
//Loop over the .g-recaptcha wrapper elements.
Array.prototype.forEach.call(document.getElementsByClassName('g-recaptcha'), function(element) {
//Add a load event listener to each wrapper, using capture.
element.addEventListener('load', function(e) {
//Get the data-tabindex attribute value from the wrapper.
var tabindex = e.currentTarget.getAttribute('data-tabindex');
//Check if the attribute is set.
if (tabindex) {
//Set the tabIndex on the iframe.
e.target.tabIndex = tabindex;
}
}, true);
});
data-tabindex你想要的值(value)。
<div class="g-recaptcha" data-sitekey="[SITE KEY]" data-tabindex="3">
关于recaptcha - 有没有办法在recaptcha 2中设置tabindex？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27900408/
27
4
0
如果每个元素都有自己的tabindex，如下所示: Link Option A Option B Option C Hello world Button 现在，我向 bu
例如，这是一个脚本: 所以，当用户按下 tab 并浏览六个文本框，到达最后一个然后按下 tab 时，它会转到第一个评论上方的内容，对吗？那么，如何让它再次从 tabindex="1"
$(document).on("keyup", function(e) { var code = e.which; var currentTabIndex = document.act
当提交按钮获得焦点时按 Tab 键，焦点应返回到 tabindex="1"。这是 HTML: 这是 JQuery: $("input").keydown(function (e) {
我们正在运行一个名为 Axe 的工具检查 HTML 页面的有效性和 508 合规性/可访问性。 此错误作为违规出现: Elements should not have tabindex greater
我有几个 LinearLayouts 包含在它们各自的 ScrollView 中，而 ScrollView 又包含在 ViewFlipper 中。奇怪的是，在某些布局中，一旦获得焦点，它就会自动从顶部
我有一个简单的窗口，其中嵌入了一个简单的复合控件。 (主窗口) First Second (复合控制) Third F
我刚刚把 two textbox(tabindex=0,2), one autocompletebox(tabindex=1) and one button(tabindex=3) 但在运行时自动完
WPF中的TabIndex和KeyboardNavigation.TabIndex有什么区别？什么时候使用每个？ 最佳答案 @akjoshi在他的回答中包含了有关TabIndex的非常重要的信息，
我在一个文本框旁边有 2 个按钮，在这 2 个按钮后面还有另一个文本框。第一个文本框的 tabindex 为 1000，第一个按钮为 1001，第二个按钮为 1002。第二个文本框的 tabindex
如何在表单字段上设置 html 属性“tabindex”？ 我的模板目前看起来像.. Email Address {{ form.email }} 最佳答案 选项卡索引是布局的一项功能
我有一个奇怪的行为:我有一个包含文本框和(简单)用户控件(文本框和按钮)的 MainWindow，但出于调试目的，我将其剥离为仅一个文本框。 当我使用文本框和用户控件而不设置 TabIndex 属性时
在我的 gwt 应用程序中，在某些屏幕上，我创建了一个带有输入表单的对话框。我希望能够使用 tabindex 属性，但只能在该对话框中使用。 (即:仅将该对话框的第一个字段循环到最后一个字段)现在，如
我正在使用 jQuery 自定义我自己的保管箱，但想知道如何将 tabindex 应用于它。 我尝试使用隐藏的选择焦点/模糊事件，但似乎不起作用。 我还尝试将 tabindex 属性应用于我的自定义保
我有一个带有字段的表单，其中一些字段可以隐藏。为了获得正确的可访问性，我使用 jQuery 添加 tabindex，仅添加到当前可见的元素: $(':input:visible').each(func
我有一个使用 jQuery UI 的对话框，上面有两个按钮。 对话框内部有一些表单元素，我可以使用 TAB 键进行切换。现在无法使用 TAB 键访问"is"按钮。接缝处没有 TabIndex。 我怎样
我在我的应用程序中使用 Angular JS。我在某些可点击元素上使用 tabindex 来支持应用程序的键盘用户。 我对 tabindex 的理解是，假设元素 A 的 tabindex = 1，元素
如果用户跳转到特定的选项卡索引，是否可以添加类？我想在用户选项卡到达特定索引时添加类，并在跳转到另一个索引时删除类？谢谢! 这里我想在选项卡聚焦于 tabindex=3 时添加事件类: Hello
如何为数字文本框设置标签索引..我的代码是.. $("#max_award_amount").kendoNumericTextBox({ min:0, max: 99999999.99
鉴于 浏览器有一个页面加载了带有 tabindex=1 的现有字段(称为 ef)， 通过书签插入两个新字段(nf1 和 nf2) 第一次(不正确的行为)当鼠标单击 nf1 并随后单击一个选项卡时焦点的
我是一名优秀的程序员,十分优秀！