使用jquery使用文本框取消隐藏选项卡会取消隐藏错误的部分

Unhiding tabs with jquery using text boxes unhides the wrong section

本文关键字：取消 隐藏 错误 选项 文本 jquery 使用      更新时间：2023-09-26

我有一个表单，它有几个复选框，当复选框被选中时，下面有一个部分的相应选项卡将被取消隐藏。不幸的是，当我选中第二个或第三个框时，会出现正确的选项卡，但属于第一个选项卡的部分会被它取消隐藏。我在JSFiddle中有一个例子：http://jsfiddle.net/j08691/HyMBD/2/.如果您选中"Extranet Access"复选框，则会显示"Use Agreement（US 531）"部分。以下是我用来取消隐藏选项卡和部分的代码：

//hide/show UA Section
        $("#use-agreement-required").click(function() {
            if ($("#use-agreement-required").is(":checked"))
            {
                $(".UASection").show("fast");
            } else {
                //otherwise hide it
                $(".UASection").hide("fast");
            }
        });
        //hide/show Extranet Section
        $("#extranet-access").click(function() {
            if ($("#extranet-access").is(":checked"))
            {
                //show hidden class
                $(".extranetSection").show("fast");
            } else {
                //otherwise hide it
                $(".extranetSection").hide("fast");
            }
        });
        //hide/show Move It Section
        $("#move-it-access").click(function() {
            if ($("#move-it-access").is(":checked"))
            {
                //show hidden class
                $(".moveItSection").show("fast");
            } else {
                //otherwise hide it
                $(".moveItSection").hide("fast");
            }
        });
        //Refresh tabs
        $("#use-agreement-required,#extranet-access,#move-it-access").click(function () {
            $("#contractTypes").tabs("refresh");
        });

您确定要在那里执行选项卡操作吗？从用户界面的角度来看，我认为你正朝着一条混乱的道路前进。

也就是说，显示选项卡是不够的，你需要告诉选项卡控件你正在激活一个新的选项卡：

$（"#contractTypes"）.tabs（｛active:1｝）；

请记住，索引是以0为基础的。

这会打乱您的代码。。删除，所有精细

//Refresh tabs
$("#use-agreement-required,#extranet-access,#move-it-access").click(function () {
    $("#contractTypes").tabs("refresh");
});

http://jsfiddle.net/HyMBD/5/

相关文章：