Question

我正在尝试使用条件标记来解决IE CSS问题。我执行标签框效果的jQuery调用条件标记内的id。我已经给IE新的ID，所以在IE上jQuery不起作用。我尝试在其中一个脚本中使用新id复制脚本，但是这两个脚本似乎发生冲突。

我的jQuery（在head标签之间）是（除了IE之外的所有浏览器）：

  <script>
var currentTab = 0; // Set to a different number to start on a different tab.

function openTab(clickedTab) {
 var thisTab = $(".tabbed-box .tabs a").index(clickedTab);
 $(".tabbed-box .tabs li a").removeClass("active");
 $(".tabbed-box .tabs li a:eq("+thisTab+")").addClass("active");
 $(".tabbed-box .tabbed-content").hide();
 $(".tabbed-box .tabbed-content:eq("+thisTab+")").show();
 currentTab = thisTab;
}

$(document).ready(function() {
 $(".tabs li:eq(0) a").css("border-left", "none");

 $(".tabbed-box .tabs li a").click(function() { 
  openTab($(this)); return false; 
 });

 $(".tabbed-box .tabs li a:eq("+currentTab+")").click()
});
</script>

我需要这个用于IE：

    <script>
var currentTab = 0; // Set to a different number to start on a different tab.

function openTab(clickedTab) {
 var thisTab = $(".tabbed-box .tabs a").index(clickedTab);
 $(".tabbed-box ie-.tabs li a").removeClass("active");
 $(".tabbed-box ie-.tabs li a:eq("+thisTab+")").addClass("active");
 $(".tabbed-box .tabbed-content").hide();
 $(".tabbed-box .tabbed-content:eq("+thisTab+")").show();
 currentTab = thisTab;
}

$(document).ready(function() {
 $(".ie-tabs li:eq(0) a").css("border-left", "none");

 $(".tabbed-box .ie-tabs li a").click(function() { 
  openTab($(this)); return false; 
 });

 $(".tabbed-box .ie-tabs li a:eq("+currentTab+")").click()
});
</script>

头部中的2个脚本相互冲突。也许有办法将它们结合起来？

Answer 1

IE条件评论是您的朋友

<!--[if IE]>
<script>
   // The IE script
</script>
<![endif]-->

<![if !IE]>
<script>
   // The script for other browsers
</script>
<![endif]>

IE只会看到第一个脚本。所有其他的浏览者只看到第二个。

如果您只希望对某个旧版本的IE 进行“特殊处理”，但是IE8或IE9等新版本的行为正常且可以使用标准脚本，那么请写下条件这样：

<!--[if IE lte 6]>
   // The script for IE6 and below
</script>
<![endif]-->

这种方式只有IE 6及以下才能看到这个脚本。较新的IE版本将使用标准脚本。

一旦不再需要对这些版本的IE的支持，这也允许你干净地扔掉特殊脚本。

Answer 2

避免浏览器检测，而是处理功能检测。在这种情况下，您要查找的功能是是否存在具有.ie-tabs类

的对象

最简单的事情是

var tabs;
if ($(".ie-tabs").length > 0) {
    tabs = $(".ie-tabs");
} else {
    tabs = $(".tabs");
}

然后使用$ .fn.find

更改为代码以引用其他所有内容

tabs.find("li a").removeClass("active");

Answer 3

听起来你需要弄清楚浏览器是否支持某些功能。

来自http://api.jquery.com/jQuery.support/

不是使用$ .browser来检测当前用户代理并根据运行的浏览器更改页面显示，而是执行特征检测是一种很好的做法。这意味着在执行依赖于浏览器功能的代码之前，我们会进行测试以确保该功能正常工作。为了简化这个过程，jQuery执行了许多这样的测试，并将结果作为jQuery.support对象的属性提供给我们。

以下是一些解释特征检测功能的资源：

Answer 4

您可以使用jQuery来确定要使用的浏览器和脚本，如下所示：

$(function () {
    if ($.browser.msie) {
        /** IE version here... **/
    }
    else {
        /** Other version here... **/
    }
});

Answer 5

如果用逗号分隔，可以将多个CSS选择器传递给$（）函数。例如：

$(".tabbed-box .tabs li a, .tabbed-box .ie-tabs li a").click(function() { 
  openTab($(this)); return false; 
});

这是组合版本。您可以对$（）的所有其余调用使用相同的概念。

Answer 6

你可以用它来检查是否

if（$ .browser.msie）{

alert（“这是ie版本”+ $ .browser.version）;

}

如何为2个浏览器创建2个不同的脚本（IE +所有其余的）

6 个答案: