Question

我的手上有一个相对大的问题。我有一个使用IE7的客户端，我们创建的名片websolution在浏览器中加载带有ajax内容的标签时出现问题。

我们正在使用http://www.sohtanaka.com/web-design/simple-tabs-w-css-jquery/

中的简单标签

我们预览了从下拉列表中选择时加载的名片。然后将名片的正面和背面装入2个单独的标签，分别称为正面和背面。

在FF，Chrome，IE8 +中查看加载不同名片时没有问题，但在IE7中（也可能是旧版本，但我们已经退出支持），只有前面（这是默认的） tab）已加载。一旦选择“返回”，就不会加载预览（ajax） - 返回“前”选项卡时，在“后退”选项卡中也会使“前”选项卡为空。

这是我们正在使用的代码

<script type="text/javascript">
function tabs() {

//When page loads...
$(".tab_content").hide(); //Hide all content
$("ul.tabs li:first-child").addClass("active").show(); //Activate first tab
$(".tab_content:first-child").show(); //Show first tab content

//On Click Event
$("ul.tabs li").click(function() {

    $("ul.tabs li").removeClass("active"); //Remove any "active" class
    $(this).addClass("active"); //Add "active" class to selected tab
    $(".tab_content").hide(); //Hide all tab content

    var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content

    $(activeTab).fadeIn(); //Fade in the active ID content
    return false;
});

 };
 </script>

我已经创建了一个演示用户供您试用 - 该网站是丹麦语，但我提供了简短的翻译

http://ftp.inprint.dk/web2inprint/

用户名（Brugernavn）：测试

密码：测试

这将带您进入配置屏幕。

在这里，您可以在名为“Skabelon”的第一个下拉列表中选择一个模板。在右侧预览中，您有

Forside - Front

Bagside - 返回

希望这有帮助。

提前感谢能够解决这个问题的任何人！

Answer 1

我在IE上遇到过很多这样的问题。基本上，当您的选项卡加载并且“后退”选项卡被隐藏时，该选项卡中的任何其他控件将呈现为宽度0和高度0，或者在客户端标记为可见假。

您可能想要尝试查看“后退”选项卡上是否存在实际内容，以及是否其尺寸为0.如果是这种情况，则只需调整大小到正确的尺寸

编辑：要处理IE默默无闻，您可能想尝试这个

$("ul.tabs li").click(function() {

    $("ul.tabs li").removeClass("active"); //Remove any "active" class
    $(this).addClass("active"); //Add "active" class to selected tab
    $(".tab_content").hide(); //Hide all tab content

    var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content

    $(activeTab).fadeIn(); //Fade in the active ID content
    // IE Hack starts
     if($.browser.msie && $.browser.version.indexOf("7.")>-1){
       $(".active").show(); //or adjust the selector to show the right tab please.
     }
    // IE Hack ends
    return false;
});

 };

使用AJAX内容的jQuery选项卡无法使用IE7

1 个答案: