Javascript 如何为一组控件处理2个可能的选项卡索引值？

我用的是Telerik的剑道界面。 在我的表格上，我有6个文本框，A、B、C、D、E和F

如果A的值是X、Y或Z，那么B-E需要设置为只读，我们希望自动切换到文本框F

如果A的值发生变化，那么我们需要删除B-E的只读状态，并使其按原始顺序进行制表

实际上，我在Firefox和Chrome上都可以使用，但Internet Explorer不能正常工作。制表符从这些文本框跳转到与此无关的一组完全独立的控件

那么，如何维护两个可能的制表符值（-1或X，其中X是创建控件时使用的“默认”值），以便根据只读状态在控件之间动态制表

请注意，我不能依赖于禁用控件（而不是使其只读），因为这会导致问题；即使控件有值，该值也不会传输到服务器，从而导致该属性的

null

。（见附件）

代码如下：

//This function will toggle the ReadOnly state of a control array
//   based on the parent control's value
function SetReadOnly(controlArray, parentComboId)
{
    var parentVal = $("#" + parentComboId).val();
    var tabIndex = 1;

    if (parentComboId == "A")
    {
        var regex = /07|09|10|88/;

        if (regex.test(parentVal) || parentVal == "" || parentVal == "-")
        {
            isReadOnly = true;
            tabIndex = -1;
        }
        else
        {
            isReadOnly = false;
            tabIndex = 1;
        }

        for (var i = 0; i < controlArray.length; i++)
        {
            $("#" + controlArray[i]).prop("readonly", isReadOnly);
            SetTabIndexVals2(controlArray[i], 'TEXTBOX', tabIndex);
        }
    }
    else
    {
        // logic other groups of parent-child controls
    }
}

// This function sets the tab index of the control
function SetTabIndexVals(controlID, controltype, tabIndex)
{
    try
    {
        var _eTabIndex;
        if (tabIndex == -1)
        {
            if (controltype == 'TEXTBOX')
            {
                _eTabIndex = $("#" + controlID).attr('tabindex');
                if (_eTabIndex > 0)
                {
                    $("#" + controlID).attr('Oldtabindex', _eTabIndex);
                    $("#" + controlID).attr('tabindex', tabIndex);
                }
            }
            else
            {
                // logic for other types of controls
            }
        }
        else
        {
            if (controltype == 'TEXTBOX')
            {
                _eTabIndex = $("#" + controlID).attr('Oldtabindex');
                if (_eTabIndex == undefined || _eTabIndex < 0 || _eTabIndex == null)
                    _eTabIndex = $("#" + controlID).attr('tabindex');
                $("#" + controlID).attr('Oldtabindex', _eTabIndex);
                $("#" + controlID).attr('tabindex', _eTabIndex);
            }
            else
            {
                // logic for other types of controls
            }
        }
    } catch (err)
    {
        logError(err, arguments.callee.trace());
    }
}

//此函数将切换控件数组的只读状态
//基于父控件的值
函数SetReadOnly（controlArray，parentComboId）
{
var parentVal=$（“#”+parentComboId）.val（）；
var指数=1；
如果（parentComboId==“A”）
{
var regex=/07 | 09 | 10 | 88/；
if（regex.test（parentVal）| | parentVal==“”| | parentVal==“-”）
{
isReadOnly=true；
tabIndex=-1；
}
其他的
{
isReadOnly=false；
tabIndex=1；
}
对于（var i=0；i0）
{
$（“#”+controlID）.attr（'Oldtabindex'，_eTabIndex）；
$（“#”+controlID）.attr（'tabindex'，tabindex）；
}
}
其他的
{
//其他类型控件的逻辑
}
}
其他的
{
如果（controltype=='TEXTBOX'）
{
_eTabIndex=$（“#”+controlID）.attr（'Oldtabindex'）；
如果（_eTabIndex==未定义的| | _eTabIndex<0 | | | u eTabIndex==null）
_eTabIndex=$（“#”+controlID）.attr（'tabindex'）；
$（“#”+controlID）.attr（'Oldtabindex'，_eTabIndex）；
$（“#”+controlID）.attr（'tabindex'，_eTabIndex）；
}
其他的
{
//其他类型控件的逻辑
}
}
}捕捉（错误）
{
logError（err，arguments.callee.trace（））；
}
}

---

此函数适用于下拉列表，但不适用于文本框。

您是否考虑过使用Kendo的MVVM框架来控制此类行为？这可能会简化您的解决方案。至于只读问题，为什么不将k-state-disabled类应用于控件，以便在不实际禁用控件的情况下有效地将控件置于

readonly

状态。@DavidShort我不熟悉Kendo的MVVM，但是这是一个非常大的应用程序，尝试将其添加到中可能是不可能的。不过，我将研究

k-state-disabled

路线。我们显然在应用程序的其他位置使用了它，我只是不熟悉它。虽然我们实际上禁用了那些使用它的位置的控件，但我必须看看这会对我在文章中提到的问题产生什么影响。谢谢MVVM模型仅在我构建的大型应用程序的特定部分使用时才在该页面上使用。我猜问题在于你拥有的控件1）如果控件被禁用，那么当发布到服务器时，你肯定会期望数据为空/空。2） 与其禁用项目（如果您需要保留其以前的值），为什么不在屏幕上隐藏“禁用”项目？@davidshor我们有几个不同的“状态”。当一条记录被用户“锁定”时，我们对所有内容都使用禁用状态——但我们不会清除控件。所以，如果你打开一个锁定的记录，你仍然会看到数据，但你不能编辑任何东西。此外，某些字段可能包含基于其他控件值的“计算”值，我们的用户通常会复制/粘贴该值，因此在这种情况下，我们希望使用只读而不是禁用。有很多不可靠的“gotchya”情况。为什么不将“只读”字段显示为标签，如果它们是可编辑的，则返回控件，这样它们仍然可以复制和粘贴内容，然后您需要担心的是在“仅显示/编辑”方法之间切换？