jQuery click on image ничего не делает

Я пытаюсь получить код jQuery для выполнения при щелчке изображения, моя проблема в том, что он будет выполняться только в том случае, если я просто щелкнул изображение. Я полагаю, моя проблема в том, что у меня есть все изображения, помещенные внутри div с именем photo с фиксированной шириной и высотами. Изображения ограничены для размещения внутри div без искажения изображения из его первоначальных ограничений. Изображение не заполнит div, поэтому, когда я нажимаю только изображение, я нажимаю на div, а не на изображение. Как я могу изменить свой код ниже, чтобы он выполнялся, только если изображение внутри div photo нажато? Я новичок в jQuery, поэтому, пожалуйста, простите мой вопрос, если это довольно простое решение.jQuery click on image ничего не делает

$("body").click(function(event) { 
    var $target = $(event.target).attr('class'); 
    var $idOfPhoto = event.target.id; 
    if ($target == "photo") { 
$('#lightBox').lightbox_me({ 
    centered:true, 
    onLoad:function() { 
     $('#lightBox').empty(); 
     $('#lightBox').prepend('<img src="/Victoria/images/photoGallery/' + $idOfPhoto + '" />'); 
    } 
}); 

} 
});

Вот код в полном объеме:

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>Victoria Mendiola</title> 
     <link rel="stylesheet" href="css/style.css"> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
     <link type="text/css" href="css/jquery.jscrollpane.css" rel="stylesheet" media="all" /> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
     <script type="text/javascript" src="css/jquery.mousewheel.js"></script> 
     <script type="text/javascript" src="css/jquery.jscrollpane.min.js"></script> 
     <script src="/resources/library/jquery.lightbox_me.js"></script> 
     <script src="/resources/library/jquery.browser.js"></script> 
     <script src="jquery.cycle.all.js"></script> 
    </head> 

<body> 
    <div id="lightBox"> 

    </div> 
    <div class="container"> 
     <div class="logo"> 
     <img class="victoriaLogo" src="images/Victoria-logo.png" /> 
     </div> 
     <div class="navigation"> 
      <a class="navText" href="index.php">Home</a> 
      <a class="navText" href="gallery.php">Gallery</a> 
      <a class="navText" href="#about">About</a> 
      <a class="navText" href="contact.php">Contact</a> 
     </div> 
    <script> 
     $(function() 
{ 
    $('.galleryContainer').jScrollPane(); 
}); 
    </script> 
    <div class="galleryContainer"> 
<?php 
require 'DB.php'; 

    try{  
    $stmt ='SELECT * FROM victoria'; 
    foreach ($conn->query($stmt) as $row) 
     { 
     echo ('<div class="photo" id="' . $row['name'] . '"> 
     <img src="images/photoGallery/thumbnails/' . $row['name'] . '" /> </div> </a>'); 

     } 
    } catch (PDOException $e){ 
     echo 'Connection failed: ' . $e->getMessage(); 
    } 


?> 
    </div> 

    <script> 
     $("body").click(function(event) { 
      var $target = $(event.target).attr('class'); 
      var $idOfPhoto = event.target.id; 
      if ($target == "photo") { 
     $('#lightBox').lightbox_me({ 
      centered:true, 
      onLoad:function() { 
       $('#lightBox').empty(); 
       $('#lightBox').prepend('<img src="/Victoria/images/photoGallery/' + $idOfPhoto + '" />'); 
      } 
     }); 

     } 
     }); 
</script> 
</div> 
</body> 

</html>

источник

2013-09-15 Yamaha32088

есть только один класс в event.target элемент? Почему не http://api.jquery.com/hasClass/? – Sergio

Опубликовать разметку тоже. Www.jsfiddle.net было бы здорово! – Cristy

@Sergio да все изображения, содержащиеся в отдельных div с классом 'photo', каждому присваиваются отдельным идентификаторам – Yamaha32088

$('.photo').click(function() { 
    $('#lightBox').lightbox_me({ 
    centered:true, 
    onLoad:function() { 
     $('#lightBox').empty(); 
     $('#lightBox').prepend('<img src="/Victoria/images/photoGallery/' + $idOfPhoto + '" />'); 
    } 
    }); 
});

источник

2013-09-16 01:55:09 mikekavouras

jQuery click on image ничего не делает

ответ

Смежные вопросы