[jQuery] Re: div contains
  • -> select div but NOT li

    • Mon, 27 Apr 2009 06:10:29 -0700

    what you are doing is called event delegation, there's more to it than simple selectors . You could be clicking in the div but not on an li or clicking on the contents of an li. That's what was meant by "  //You will have to check whats the real target " for a list item

    $('#plan').click(function(event) {
         var $thisLi, $tgt = $(event.target);
        if ($tgt.is('li')) {
            $thisLi = $tgt
          ///work with $thisLi to get css info
        }   
        ////// check if click is on li or contents of an li   or somewhere else in #plan
        else if ($tgt.parents('li').length) {
          $thisLi = $tgt.parents('li:first');
          ///work with $thisLi to get css info
        }

    this is a modification of following excellent tutorial example
    http://www.learningjquery.com/2008/03/working-with-events-part-1

    hope this helps


    gostbuster wrote: 
    Hi,

Yes of course I could do this, but Jquery selectors don't allow what I
wish to do?
    
Thanks.

On 27 avr, 14:25, Remon Oldenbeuving <r.s.oldenbeuv...@gmail.com>
wrote:
  
    You could use the event object thats being passed when a click event fires?

$('#plan').click(function(e){
 if(e.target !== "liobject"){ //You will have to check whats the real target
for a list item
  //here your code
 }

});

On Mon, Apr 27, 2009 at 2:08 PM, gostbuster <jeremyescol...@gmail.com>wrote:



    
    Okay I'll try to explain better.
      
    Imagine an image, it's a rectangle.
      
    you can have a div with this image for background :
      
    like this :
      
    <div id="plan">
....
</div>
      
    Then, with CSS, you can do this :
      
    #plan{
background:url(my image url);
width : image width;
height: image height....
}
      
    Well, my image is representing a map.
      
    over my map, I have little icons (like in google map : you have the
map and spots)
      
    that's why I have something like this :
      
    <div id="plan"> <-- this is the map ID, with the map image for
background
  <ul>
      <li>....</li>
      <li>....</li> <-- each li represents a spot. the spot is an
image displayed at the spot position in the map -->
      <li>....</li>
 </ul>
</div>
      
    I want to be able to click on the map (on the div #plan) but NOT on a
li element.
      
    Is it more understandable ?
      
    Thank you very much
      
    On 27 avr, 13:55, Charlie <charlie...@gmail.com> wrote:
      
    your question isn't very clear . If you are trying to select based on
        
    what is inside the div these should help:
      
    $("div:contains("Some Text")).// do something
or
$("div:has(li[class=something])").// do somethinghttp://
        
    docs.jquery.com/Selectors
      
    need to be more specific what you are trying to do. The way your question
        
    is written " $("plan"). //do something " would work
      
    gostbuster wrote:Hi everyone, I would appreciate some help with what I
        
    wanna do. I explain my problem : I want to do a map-like: It means a div
with background images, and some elements on it (a bit like in google map :
you have the map in background, and stuff you can click over it. well i have
this code : <div id="plan"> <ul> <li>....</li> <li>....</li> <li>....</li>
</ul> </div> I would like to select #plan but NOT the li element inside. I
tried some stuff but didn't succeed. I'm sure experts from here will solve
this problem in less in a second. Thank you VERY MUCH in advance.

    Reply via email to