代码之家 › 专栏 › 技术社区 › Ben

jQuery确定页面上是否存在元素

jquery javascript

Ben · 技术社区 · 15 年前

如何确定页面上是否存在元素…例如。。。

$('select[name="modifier_option"]')

如果那个选择框存在于屏幕上,我需要验证它在页面上的值,以确保它的值是gt;0,但是如果它不存在,我就不必担心它。

3 回复 | 直到 15 年前

Shawn 15 年前

    if( $('select[name="modifier_option"]').length )
{
     // it exists
}

Community Mohan Dere 9 年前

从此处复制/粘贴: Is there an "exists" function for jQuery?

jQuery.fn.exists = function(){return jQuery(this).length>0;}

if ($(selector).exists()) {
    // Do something
}

Community Mohan Dere 9 年前

我用下面的插件回答了同样的问题 here . 有关创建插件的详细信息,请访问answer。

如果元素存在,下面的插件将允许您使用回调特性(与jQuery样式标记保持内联)。因此,对于您的示例,您可以执行以下操作:

$('select[name="modifier_option"]').exist(function() {
    if ($(this).val() > 0) {
        /*  DO WORK */
    }
    else {
        /*  is not greater than 0
            DO OTHER WORK   */
    }
})

插件

(function($) {
    if (!$.exist) {
        $.extend({
            exist: function() {
                var ele, cbmExist, cbmNotExist;
                if (arguments.length) {
                    for (x in arguments) {
                        switch (typeof arguments[x]) {
                            case 'function':
                                if (typeof cbmExist == "undefined") cbmExist = arguments[x];
                                else cbmNotExist = arguments[x];
                                break;
                            case 'object':
                                if (arguments[x] instanceof jQuery) ele = arguments[x];
                                else {
                                    var obj = arguments[x];
                                    for (y in obj) {
                                        if (typeof obj[y] == 'function') {
                                            if (typeof cbmExist == "undefined") cbmExist = obj[y];
                                            else cbmNotExist = obj[y];
                                        }
                                        if (typeof obj[y] == 'object' && obj[y] instanceof jQuery) ele = obj[y];
                                        if (typeof obj[y] == 'string') ele = $(obj[y]);
                                    }
                                }
                                break;
                            case 'string':
                                ele = $(arguments[x]);
                                break;
                        }
                    }
                }

                if (typeof cbmExist == 'function') {    //  has at least one Callback Method
                    var exist =  ele.length > 0 ? true : false; //  strict setting of boolean
                    if (exist) {    // Elements do exist
                        return ele.each(function(i) { cbmExist.apply(this, [exist, ele, i]); });
                    }
                    else if (typeof cbmNotExist == 'function') {
                        cbmNotExist.apply(ele, [exist, ele]);
                        return ele;
                    }
                    else {
                        if (ele.length <= 1) return ele.length > 0 ? true : false;
                        else return ele.length;
                    }
                }
                else {  //  has NO callback method, thus return if exist or not based on element existant length
                    if (ele.length <= 1) return ele.length > 0 ? true : false; //   strict return of boolean
                    else return ele.length; //  return actual length for how many of this element exist
                }

                return false; //    only hits if something errored!
            }
        });
        $.fn.extend({
            exist: function() {
                var args = [$(this)];
                if (arguments.length) for (x in arguments) args.push(arguments[x]);
                return $.exist.apply($, args);
            }
        });
    }
})(jQuery);

jsFiddle