如何禁用和重新启用隐藏/可见元素的tabindex?

时间:2012-09-20 19:14:07

标签: javascript jquery html css

如何根据元素是否可见(在可查看区域中)更改元素的tabindex?我想执行以下操作之一:在输入新部分时重置当前tabindex,并为该部分中的元素分配新的tabindex。或者能够禁用并重新启用某些元素的tabindex

HTML:

    <div id="nav">
        <a id="firstLink" href="#section1" tabindex="1">Go to section 1</a>
        <a id="secondLink" href="#section2" tabindex="2">Go to section 2</a>
    </div>
    <div id="container">
        <div id="section1">
            <a href="#" tabindex="3">Specific to section 1</a>
        </div>
        <div id="section2">
            <a href="#" tabindex="3">Specific to section 2</a>
        </div>
    </div>

如果链接部分可见,我希望链接仅在Tab键顺序中。

的CSS:

    #container{
        overflow: hidden;
        width: 400px;
        height: 400px;
    }

    #section1{
        background: red;
        width: 400px;
        height: 400px;
    }

    #section2{
        background: green;
        width: 400px;
        height: 400px;
    }

实例:http://jsfiddle.net/2UF3n/5/

1 个答案:

答案 0 :(得分:2)

您可以在任何隐藏字段中动态添加或删除disabled="disabled",以忽略其tabindex值。

$("a:hidden").attr("disabled","disabled");