将“if”逻辑添加到 jQuery 链

Posted 2023-05-09

【中文标题】将“if”逻辑添加到 jQuery 链

【英文标题】：adding 'if' logic to a jQuery chain

【发布时间】：2011-01-05 16:59:30

【问题描述】：

假设我有以下 jQuery：

// pseudocode  :
$(this)
    .doSomething
    .doSomething
    .selectSomething
        .doSomething
        .animate( 
            opacity: 1
        , 150)
        .end()
    .selectSomethingElse
        .doSomething

我希望执行上述操作。但是，如果浏览器是 IE，我不希望执行动画部分（因为 IE 无法使用透明 PNG 为对象设置动画并保留 PNG 透明度）。

是否有办法维持良好的链式 jquery 语法，但基于某些 if 逻辑以某种方式跳过动画部分（在这种情况下测试 IE）？

【参考方案1】：

您可以执行each() 并向其传递一个处理动画的函数，这应该可以工作。

$(this)
    .doSomething
    .doSomething
    .selectSomething
        .doSomething
        .each(function() 
            // Will return false on IE, true on others
            if(jQuery.support.opacity) 
                $(this).animate( 
                    opacity: 1
                , 150);
            
        )        
    .end()
.selectSomethingElse
    .doSomething

【参考方案2】：

您可以使用filter 过滤掉IE：

$(this).filter(function() 
    return $.support.opacity;
).animate( 
    opacity: 1
, 150);

【参考方案3】：

在此之前我有一段代码检查 IE，如果找到，则删除第一个“.selectSomething”正在使用的任何选择器。或者，稍微修改 .selectSomething 使其检查仅存在于非 IE 浏览器中的附加类。

这有助于让您的浏览器检测逻辑保持独立。

【讨论】：

是的，在某处插入一个额外的类似乎是一种选择，尽管需要在 jquery 链中进行更多的遍历。我不想排除整个区块，因为我希望所有区块都执行，而不管浏览器如何，除了链的一部分。