How do I compare two jQuery objects for identity?

Question

I'm trying to use jQuery to open / close control 'boxes' on a webpage. Unfortunately, it doesn't look very good to close a box just to re-open it if the user happens to click on the already opened box. (Boxes are mutually exclusive).

The code I'm using doesn't work, and I'm not sure why. I still get a box closing just to open up anew, which isn't the desired functionality. I created the 'val' variable for debugging purposes; in the debugger, it shows 'val' as having the exact same value as $(this), which should prevent it from getting to the .slideToggle() inside the if statement, but doesn't.

function openBox(index)
{
  val = $('#box' + index);
  $('.profilePageContentBox').each(function(){
      if($(this).css('display') != 'none')
      {
        if($(this) != val)
        {
          $(this).slideToggle(200);
        }
      }
    });
  val.slideToggle(200);
}

You might want to also look at this: stackoverflow.com/questions/2436966/… — GnrlBzik
– GnrlBzik, Commented Apr 18, 2013 at 20:10

qwertymk · Accepted Answer · 2011-08-08 17:25:11Z

88

You can also do:

 if(val.is(this))

answered Aug 8, 2011 at 17:25

qwertymk

35.6k31 gold badges127 silver badges184 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Brandon Over a year ago

Simple and straight forward. Great answer

m1. Over a year ago

best answer here. kudos!

Kim Steinhaug Over a year ago

The Object.is() method determines whether two values are the same value, this is the correct answer and this is how you fish with your bare hands :D

nickf · Accepted Answer · 2011-08-08 17:22:47Z

53

Using the $() function will always create a new object, so no matter what, your equality check there will always fail.

For example:

var div = document.getElementById('myDiv');

$(div) === $(div);   // false!

Instead, you could try just storing the actual DOM elements, since those are just referred to inside jQuery objects.

val = $('#box'+index).get(0);
...
if (this !== val) { }

answered Aug 8, 2011 at 17:22

nickf

548k199 gold badges660 silver badges727 bronze badges

2 Comments

RonLugge Over a year ago

Thanks! As soon as StackOverflow lets me I'll accept this answer. Not only did you answer the question itself, you also explained the conceptual flaw that was screwing me up -- 'give a man a fish, teach a man to fish'

Dylan Hayes Over a year ago

this guy taught you how to fish with a fishing pole (lame), the bottom answer teaches you how to fish with your bare hands (BA)!

ShankarSangoli · Accepted Answer · 2011-08-08 17:21:57Z

0

Try this:

function openBox(index)
{
val=$('#box'+index);
$('.profilePageContentBox').each(function(){
    if($(this).is(":visible"))
    {
        if(!$(this).is("#box"+index))
            $(this).slideToggle(200);
    }
});
val.slideToggle(200);
}

answered Aug 8, 2011 at 17:21

ShankarSangoli

69.9k13 gold badges96 silver badges124 bronze badges

Collectives™ on Stack Overflow

How do I compare two jQuery objects for identity?

3 Answers 3

3 Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related