asp.net-mvc - 通过 div 元素更改订单用户选项卡

Question

下面是我在 ASP MVC 视图中使用的代码。我希望标签顺序按以下顺序从以下字段集中的第一个文本框输入到最后一个文本框输入：

1. 代理类型字段
2. 基本字段
3. 地址字段
4. 通讯领域
5. 分布字段
6. DRM 字段
7. DSSA 代理 ID
8. DSS 字段

现在当页面的焦点在 的第一个输入框时AgentTypeFields，也就是 中的字段leftDiv集topDiv。当用户完成通过此字段集的选项卡时，焦点将转移到 的第一个输入DistributionFields。基本上，我需要选项卡索引从leftDiv从topDiv, middleDiv, 到的字段集移动bottomDiv，然后通过rightDiv同一 top/middle/bottom 的元素进行备份divs。

我尝试在and元素上放置一个tabindex属性，但这只是将焦点放在元素本身上，而不是其中包含的输入。在 HTML/CSS 方面不是最好的，所以任何建议/帮助将不胜感激。谢谢！divfieldset

<div id="BigDiv" style="clear:both;">
    @Html.HiddenFor(model => model.CreatedDate)
    @Html.HiddenFor(model => model.CreatedOperator)
    @Html.HiddenFor(model => model.ReferenceNumber)
    @Html.HiddenFor(model => model.ReferenceType)
    @Html.HiddenFor(model => model.ExtRepType) 
    @Html.HiddenFor(model => model.Region)
    @Html.HiddenFor(model => model.INDDist)
    <div id="topDiv">
        <div class="LeftDiv" style="width: 450px; float:left;">
            <fieldset id="AgentTypeFields" style="width: 400px;">...</fieldset>
        </div> 
        <div class="RightDiv" style="width: 450px; float:left;">
            <fieldset id="DistributionFields" style="width: 400px;">...</fieldset>
        </div>
    </div>
    <div id="middleDiv">
        <div class="LeftDiv" style="width: 450px; float:left;">
            <fieldset id="BasicFields" style="width: 400px;">...</fieldset>
        </div>
        <div class="RightDiv" style="width: 450px; float:left;">
            <fieldset id="DRMFields" style="width: 400px;">...</fieldset>
        </div>
    </div>
    <div id="bottomDiv">
        <div class="LeftDiv" style="width: 450px; float:left;">
            <fieldset id="AddressFields" style="width: 400px;">...</fieldset>

            <fieldset id="CommunicationFields" style="width: 400px;">...</fieldset>
        </div>
        <div class="RightDiv" style="width: 450px; float:left;">
            <fieldset id="DSSAgentIds" style="width: 400px;">...</fieldset>

            <fieldset id="DSSFields" style="width: 400px;">...</fieldset>
        </div>
    </div>
    <p>
        <input type="submit" value="Save" />
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        @Html.ActionLink("Back to Search", "Index", "Agent")  
    </p>
</div>

Answer 1

将 tabindex 放在这些字段集中的第一个字段上，而不是字段集本身。但是，这确实会惹恼那些来到您网站的盲人。