gpt4 book ai didi

recaptcha - 有没有办法在recaptcha 2中设置tabindex?

转载 作者:行者123 更新时间:2023-12-04 17:47:47 27 4
gpt4 key购买 nike

我有一个带有多个文本字段的自定义表单。所有这些元素都有一个 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> .

在表格中使用 Tab 键时,顺序如下:
  • 用户名
  • 密码
  • 提交按钮
  • 验证码

  • 所需的顺序如下:
  • 用户名
  • 密码
  • 验证码
  • 提交按钮
  • 最佳答案

    昨天我花了大量时间调试 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);
    });

    在你的 HTML 中,包含 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
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com