我如何在jQuery中简化我的if条件

时间:2013-05-24 08:22:33

标签: javascript jquery

我正在寻找一种方法来执行以下操作:

$("#a" || "#b").val() === ""

而不是:

$("#a").val() === "" || $("#b").val() === ""

有什么想法吗?

提前致谢!

4 个答案:

答案 0 :(得分:3)

对于两个元素,我相信你的例子就像你能做到的那样简短,其含义是明确的。但是,如果您希望重复此类逻辑或评估更多元素,您可以通过创建一个简单函数来评估集合中的任何项是否与条件匹配。

扩展jQuery

$.fn.any = function (evaluator) {
    var items = $(this);
    for (var i = 0; i < items.length; i++) {
        if (evaluator(items[i]) === true) {
            return true;
        }
    }

    return false;
};

演示: http://jsfiddle.net/xE76y/1/

这类似于.Net LINQ库*中实现的Any()方法(我确信在其他库中实现,特别是那些面向函数式编程的库)。在c#中,你会称这样的方法:

enumerable.Any( o => o.Value == "" );

JavaScript的语法(遗憾的是)并不简洁;你得到的结果如下:

array.any( function(o){ return o.value === ""; } );

到目前为止,这还没有为你节省任何东西。但是,如果要迭代大量元素,它会变得更加优雅。

// there could be zero inputs or 100 inputs; it doesn't matter
var result = $("input").any(function (o) {
    return o.value === "";
});

原生解决方案

请注意,我们的any()方法并不依赖于jQuery。您还可以考虑使用本地JavaScript解决方案,例如the Array.some() method

  

some()为每个元素执行一次回调函数   数组,直到找到一个回调返回真值的数组。如果   找到这样的元素,有些元素会立即返回true。

演示: http://jsfiddle.net/xE76y/2/

var result = jQuery.makeArray($("input")).some(function (o) {
    return o.value === "";
});

由于这是一个数组方法,它只适用于数组。不幸的是,document.getElementsByTagName("input").some(...) 工作,因为getElementsByTagName()返回NodeList

当然,您可以将任何想要的内容推送到数组中并在该数组上调用some()。在示例中调用jQuery.makeArray()只是为了方便。

摘要评估函数

演示: http://jsfiddle.net/xE76y/3/

可能会重用评估函数(例如测试空字符串)。这些可以进一步抽象出来。

// ideally, this should NOT be left in global scope
function isEmpty(input) {
    return input.value === "";
}

// the check now fits nicely in one line.
if ($("input").any(isEmpty)) {
    alert("At least one input is empty.");
}

结果方法调用非常简洁:$("#a, #b").any(isEmpty)$("input").any(isEmpty)


*另外值得注意的是LINQ已经recreated for JavaScript

答案 1 :(得分:2)

请尝试这样:

 if ($('#a,#b').is(':empty'))
    {
      alert("Either a or b is Empty!");
     }

试试我的demo

修改

如果它是像文本框那样的输入类型,那么它会有点笨重但会达到同样的效果:

if ($.inArray("",[ $("#a").val(), $("#b").val() ])>=0)
{
    alert("Either a or b is Empty!");   
}

查看另一个Demo

答案 2 :(得分:0)

如果你想避免重复空字符串"",你可以这样做:

if ($.inArray([ $("#a").val(), $("#b").val() ], ""))

或者如果你只想用jQuery选择一次:

if ($.inArray($("#a, #b").map(function() { return this.value; }), ""))

但我不会自己使用其中任何一种。它们可以说效率低,设计更多,而且比“简单”的方式更难以阅读!

答案 3 :(得分:-1)

我不是 javaScript 的专家,但您要与我们交叉核对:

  

http://api.jquery.com/multiple-selector/

     

jQuery selector regular expressions

另外,一种方法是使用.each函数,如

  

jQuery Multiple ID selectors