Live query plugin doesn't work with the visible attribute selector

Question

I have the following running in the jquery ready function

$('[id$=txtCustomer]:visible').livequery(
       function() { alert('Hello') }, 
       function() { alert('World') }
   );

I get an alert for the first time saying 'Hello' but the functions are not called onwards when i toggle this visibility of the textbox.

Please help.

Answer 1

The livequery "match/nomatch" events don't work with jQuery pseudoselectors like ":visible". They do work for class selectors.

An easy fix would be to also add a class when you show the item, and remove a class when you hide the item.

For example:

(html)

<input type="button" value="toggle"/>
<div id="item" 
     style="width:100px;height:100px;background-color:#ff0" 
     class="Visible">
</div>

(script)

$(function() {

 $("#item.Visible").livequery(
     function() {
        alert("match");
     },
     function() {
        alert("nomatch");
     }
   );  


  $("input").click(function() { 
      if ($("#item").is(":visible"))
         $("#item").hide().removeClass("Visible"); 
      else 
         $("#item").show().addClass("Visible"); 
    });

}); 

A demonstration of this can be found here: http://jsbin.com/uremo