检查具有相同名称属性的元素是否存在jQuery

Question

我有以下jsFiddle，它最能说明我想要做的事情。这是相当不言自明的：如果存在具有相同名称属性的元素，则不执行任何操作;如果不存在这样的元素，则追加该元素。

if (an element exists in the div 'selects' with name="folder3") {
    return false;
} else {
    $('#selects').append('<select name="folder3"></select>');
}

为这一个保持简短和甜蜜！任何帮助将不胜感激。

Answer 1

类似的东西：

if ($('#selects select[name="folder3"]').length) {

可能就是你要找的东西。

http://jsfiddle.net/Ue7VQ/1/

Answer 2

//if (an element exists in the div 'selects' with name="folder3") -yours comment
if ($('#selects').find('select[name="folder3"]').length) {
    return false;
} else {
    $('#selects').append('<select name="folder3"></select>');
}​

Live DEMO

Answer 3

if ($("#selects select[name='folder3']").length>0) {
    return false;
} else {
    $('#selects').append('<select name="folder3"></select>');
}

Answer 4

if ($('#selects select[name="folder3"]').length) {
    return false;
} else {
    $('#selects').append('<select name="folder3"></select>');
}

Answer 5

var itemName = "folder4";
var $item = $('#selects select[name="' + itemName + '"]');

if($item.length == 0)
{
    $('#selects').append('<select name="' + itemName + '"></select>');
}

小提琴here

Answer 6

检查一下。还有很多其他的工作。在这里，我检查每个下拉列表，而不是页面中的每个其他元素。 http://jsfiddle.net/Ue7VQ/4/

$(function ()
  {
      $.each( $("select"), function() {
          if ($(this).attr("name") == "folder3")
          {
              alert('Do you what you want to do over here');
          }
      });
  });​

Answer 7

我使用以下插件here回答了同样的问题。有关创建插件的详细信息，请访问答案。

---

如果元素存在，以下插件将允许您使用回调功能（保持与jQuery样式标记内联）。因此，对于您的示例，您可能会执行以下操作：

//  first callback is "if exist",
//  second callback method is "if not exist"
$('#selects select[name="folder3"]').exist(function(exist, elements, index) { // with a param, this cb will always fire
    /*  Do work for existing elements here  */
    /*  $(this) && this work just like any other jQuery method. this is the current element worked on   */
    /*  Params:
            exist: boolean (should always be true here) if exist
            elements: complete list of elements called using your selector, in this case '#selects select[name="folder3"]'
            index: the index number within the list of elements of THIS element
    */
},
function (exist, elements) {
    /*  Do alternate work, for elements do not exist    */
    /*  Params:
            exist: boolean (should always be false here) if exist
            elements: complete list of elements called using your selector, in this case '#selects select[name="folder3"]'
    */
});

| 或 |

if (!$('#selects select[name="folder3"]').exist()) {
    // element did not exist
    $('#selects').append('<select name="folder3"></select>');
}

插件

(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

Answer 8

你可以试试这个，

function checkSelects() {
        var contains = false;
        var temp = $("#selects").children();
        $(temp).each(function () {
            if ($(this).attr("name") == "folder3")
                contains = true;
         });
        if (!contains)
            $("#selects").append('<select name="folder3"></select>');

    }