сравнение объектов jQuery

Я использую селектор для получения группы объектов (0 или более):

var $openMenus = $Triggers.filter(".trigger-hover");

тогда у меня есть событие, прикрепленное к элементу, который может или не может быть в объекте выше. В этом событии, где я хочу сравнить элемент, который запускает событие, с C

$([selector])
    .focus(function(){
        var $thisMenu = $(this);
        $openMenus.each(function(){
            if ($(this) != $thisMenu ){ 
                [do something]
            }
        }) 
    })

это не сработает. Хотя несколько объектов jQuery могут ссылаться на один и тот же объект DOM, они на самом деле являются отдельными объектами jQuery и никогда не будут сравнивать true.

учитывая это, что было бы как с этим справиться? Как иметь два объекта jQuery и сравнивать их, чтобы увидеть, ссылается ли один объект jQuery на тот же элемент DOM, что и другой?

я мог бы дать каждый элемент, который я пытаюсь выбрать ID, но мне интересно, есть ли другой способ сделать это без необходимости добавлять больше в HTML.

6 ответов


Я не знаю, почему вам не нужны значения "id", но вы всегда можете сделать небольшой плагин jQuery, чтобы дать элементам уникальные значения" id", если они отсутствуют в исходном HTML.

jQuery.fn.setId = (function setupSetId() {
  var counter = 0; // or maybe new Date().getTime()
  return function setId() {
    return this.each(function setIdInternal() {
      var $self = jQuery(this);
      if (!$self.attr('id')) $self.attr('id', '_' + counter++);
    });
  };
})();

затем вы можете написать другую утилиту для сравнения массивов jQuery по идентификатору элемента.


следуя из bobince, вместо использования wrapper[0] используйте правильный метод get(0) для возврата первого элемента, хранящегося в объекте jQuery.

var focused = null;  
$(':input').focus( function() {  
   focused = $(this);  
   compare($(this)); 
   //Compare them...trivial but will return true despite being different jQuery objects.
}).blur( function() {           
   focused = null; 
});

function compare(element) {
   if (element.get(0) == focused.get(0)) {
      alert('The same');
   }
}

вы не можете сделать сравнение на оболочке jQuery, но вы можете сделать это на базовом узле DOM. Потеряйте несколько долларов, и вы в порядке:

.focus(function(){
    var that= this;
    $openMenus.each(function(){
        if (this!==that){ 
            [do something]
        }
    });
})

(или использовать, например. wrapper[0] чтобы получить узел DOM из одноэлементной оболочки jQuery.)

(я использовал === для сравнения, потому что это обычно лучше, но он будет работать с == в этом случае.)


чтобы сравнить элементы DOM, вы должны сравнить необработанные элементы, которые доступны как первый элемент в массиве, например: $('.test')[0].

Так что в вашем случае код должен выглядеть так:

$([selector])
 .focus(function(){
    var $thisMenu = $(this);
    $openMenus.each(function(){
        if ($(this)[0] != $thisMenu[0]){ 
            [do something]
        }
    }) 
})

вы можете обойти это, используя .функции братьев и сестер() в jQuery. Таким образом, вы можете избежать сравнения объектов.


$(this).mouseenter(
    function(){
        //use functions you want to replace "someFunctionHere"
        $(this).siblings().find('ul').someFunctionHere();
                  //do something else...
    }
);

лучший
Guyun


объекты jQuery нельзя сравнивать напрямую, но это может быть легко достигнуто с помощью .добавить или. не() операции:

var $thisMenu = $(this);
$openMenus.each(function(){
   if ($(this).add( $thisMenu ).length == 1 ){ 
       [do something]
   }
}) 

или

var $thisMenu = $(this);
$openMenus.each(function(){
   if ($(this).not( $thisMenu ).length == 0 ){ 
       [do something]
   }
})