이미지 위에 Ajax 함수가 있습니다.

Question

이미지 위에 함수를 실행하고 싶습니다. 나는 라이트와 JQueryThumbGallery를 사용하고 난 이미지의 ID를 가져 오지하려는

내 코드

<div class='thumbHolder' **data-id="MY-ID"** data-title="<?php echo '<span class=\'io_home\'>'.$row['io'].'</span><br /> '.$row['first_name'].' '.$row['last_name'].'<br/><span class=\'voti_home\'>'.$row['tot_voti'].' VOTI</span>'; ?>"> 
    <a rel="prettyPhoto[ajax]" href="index.php/image/view_image?ajax=true&width=700px&height=450px&id=<?php echo $row['id']; ?>" > 
    <img class="thumb_hidden" src="<?php echo base_url().'upload/concorso1/thumb/'.$row['url']; ?>" width="151" height="120" alt="<?php echo $row['first_name'].' '.$row['last_name']; ?>" /> 
           </a> 

          </div> 

이며, JQuery와 기능은 내가 이미지에서 ID를 검색해야

 function overThumb(i,j){ 

     //function called when mouse over thumb holder (plus returned item number: i = first level, j = second level) 
     console.log('overThumb: ', i,' , ', j); 
    } 

인에 나는 (overThumb 기능)을 켭니다. data-id-i 및 data-id-j를 설정하려고 시도했지만 사용 방법을 잘 모르겠습니다. 너 나 좀 도와 줄 수있어? 스크립트

는

링크

http://www.interactivepixel.net/ccThumbGallery/index_grid_horizontal_100percent_buttons.html

감사 FC

Answer 1

변경과 같이 img 태그 마크 업 렌더링 할 PHP 코드 (HTML 만! 더 기능 매여 없음)

<img class="thumb_hidden" src="Somepath/someimage.jpg" 
       data-myAttr="my custom val" id="someUniqueID" alt="some text" /> 

일부 사용 unobutrusive 자바 스크립트

<script type="text/javascript"> 
$(function(){ 
    $("img.thumb_hidden").mouseover(function() { 
     var ourImg=$(this); 
     var urlOfImage=ourImg.attr("href"); 
     var idOfImage=ourImg.attr("id"); 
     //let's get the HTML5 data attribute as well 
     var myCustomVal=ourImg.data("myAttr"); 
     //Now use these to make ajax call as necessary 
    });  
}); 
</script>