Getting an empty JQuery object

Jquery

Jquery Problem Overview


In the following code I set up a change handler on a select box to show and hide some follow up questions based on the value of the selection.

Further, for some values of the selection there is an extra message that is displayed.

In order to check to see if I need to hide the extra message, I keep a variable called Previous. Upon execution of the handler I check to see if Previous is null or if the size is 0.

It would be nice to initialize Previous to an empty JQuery object so as not to have to do the extra check for null.

Doing a $() returns an object with the size of 1.

Is there a way to create an empty Jquery object?

//Init function.
$(function(){
//Hold the previously selected object for the account type selection.

var Previous = null; //Here is where I would like to initialize. //something like Previous = $();

$("SELECT[name='AccountType']").change( function () { //Hide Previous message if there was one. if(Previous == null || Previous.size() > 0){ Previous.hide(); }

	//Show the message if found and save it as previous.
	Previous = $("#"+this.value+"_Msg").show();

	//Get fisrt question
	var FirstQuestion = $(".FirstQuestion");
	if(this.value === ''){
		FirstQuestion.hide();
	}else{
		//Manually show FirstQuestion.
		FirstQuestion.show();
	}
});

}

In the worst case I could do something like this:

var Previous = { size : function () { return 0; } };

but that seems like overkill.

Jquery Solutions


Solution 1 - Jquery

This creates an empty jQuery-object:

$([])

Update: In newer versions of jQuery (1.4+), you can use:

$()

Solution 2 - Jquery

$();

>Returning an Empty Set > >As of jQuery 1.4, calling the jQuery() method with no arguments returns an empty jQuery set (with a .length property of 0). In previous versions of jQuery, this would return a set containing the document node.

Source: api.jquery.com

Solution 3 - Jquery

My advice is don't do it that way. There are a lot easier ways of doing this. Consider:

<select id="select" name="select">
  <option value="msg_1">Message 1</option>
  <option value="msg_2">Message 1</option>
  <option value="msg_3">Message 1</option>
</select>

<div class="msg_1 msg_3">
  ...
</div>

<div class="msg_1">
  ...
</div>

<div class="msg_2">
  ...
</div>

$(function() {
  $("#select").change(function() {
    var val = $(this).val();
    $("div." + val").show();
    $("div:not(." + val + ")").hide();
  });
});

Much easier. Basically give classes to indicate what to show and hide and then there is no tracking required. An alternative is:

$(function() {
  $("#select").change(function() {
    var val = $(this).val();
    $("div").each(function() {
      if ($(this).hasClass(val)) {
        $(this).show();
      } else {
        $(this).hide();
      }
    });
  });
});

Solution 4 - Jquery

try this

 var new = $([]);

I ain't a good programmer but it gives u empty object :))

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionTom HubbardView Question on Stackoverflow
Solution 1 - JqueryMagnarView Answer on Stackoverflow
Solution 2 - JqueryTom HubbardView Answer on Stackoverflow
Solution 3 - JquerycletusView Answer on Stackoverflow
Solution 4 - JqueryBane NebaView Answer on Stackoverflow