2012-06-14 2 views
0

jquery를 사용하고 있는데 클릭 한 이미지의 src를 찾고 싶습니다. 그러나 이미지 자체를 클릭하는 것이 아니라 outerdiv를 클릭 할 수 있기를 바랍니다. 내 코드는 모두 여기에 있으며 복사하여 편집기에 붙여 넣을 수 있습니다. 이것은 간단한 코드이지만 내 프로젝트는 데이터베이스에서 태그를 생성하고 PHP를 사용하여 웹 페이지로 출력합니다. 그것은 이미지를 클릭하면 잘 작동하지만 innerdiv 또는 outerdiv를 클릭하면 안됩니다. 어떤 도움을 주시면 감사하겠습니다. jquery를 사용하기 시작했습니다. 감사합니다.바깥 쪽 div를 클릭하면 2 div 안에 중첩 된 이미지를 어떻게 선택합니까?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Jquery Select src</title> 

    <script type="text/javascript" language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
    <script type="text/javascript" language="javascript"> 
     $(document).ready(function() { 
      $(".outerdiv img").click(function(){ //output variable 'theImage' when outerdiv is clicked 
       var theImage = $(this).attr('src'); 
       alert("The image source is: " + theImage); 
      }); 
    }); //end of document ready function 
    </script> 

    <style> 
     .outerdiv {width: 300px; height: 200px; border: thin solid #000000;} 
     .innerdiv {width: 160px; height: 160px; border: thin solid #0099FF;} 
     .innerdiv img {width: 120px; height: 120px; border: thin solid #FF3300;} 
    </style> 

</head> 

<body> 

<div class="outerdiv">outerdiv 
    <div class="innerdiv">innerdiv 
     <img src="image1.jpg"> 
    </div><!--/innerdiv--> 
</div><!--/outerdiv--> 

<div class="outerdiv">outerdiv 
    <div class="innerdiv">innerdiv 
     <img src="image2.jpg"> 
    </div><!--/innerdiv--> 
</div><!--/outerdiv--> 

<div class="outerdiv">outerdiv 
    <div class="innerdiv">innerdiv 
     <img src="image3.jpg"> 
    </div><!--/innerdiv--> 
</div><!--/outerdiv--> 

</body> 

</html> 

답변

0
jQuery(".outerdiv").add("innerdiv").add("img").click(function(){ 
    var target = $(this); 
    var src = target.attr("src") || target.find("img").attr("src"); 
    }); 
+0

덕분에, 지금은 잘 작동합니다! 내가 추가해야 할 유일한 것은 false를 반환하는 것이 었습니다. 실제 이미지를 클릭하면 경고 상자가 두 번 터지는 것을 방지하는 기능의 끝에서 모두의 도움에 감사드립니다 !! – Keith

0

문제는 this 이미지가 아니기 때문에 this가하는 src 속성이 없다는 것입니다. outter div에서 이미지를 선택해야합니다.

시도 :

var theImage = $('img',this)[0].attr('src'); 
관련 문제