2010-03-24 2 views
0

qTip 플러그인을 사용하여 imdb URL을 IMDB 그래버 스크립트에 게시하고 해당 URL에 영화 정보를 표시합니다.Jquery ajax 데이터

페이지에 둘 이상의 qtip이있을 때까지 모든 기능이 작동합니다.

내가해야하는 것 들여 놓은 이미지의 데이터 만 게시합니다. 이것은 코드가 나에게 좀 더 의미가 있어야합니다.

스크립트 - 당신은 두 입력이 문제를 일으키는 동일한 ID를 가지고 있는지 볼 수

var link = $("#link").val(); 
var imdbLink = { "link" : link }; // note change to data... 

$('.moviebox').each(function() { 
    $(this).qtip({ 
     style: { name: 'light' }, 
     content: { 
     method: 'GET', 
     data: imdbLink, // you could make this { "link" : link } 
     url: '/bin/imdb/imdb.example.php', 
     text: '<img class="throbber" src="/images/loading.gif" alt="Loading..." />' 
     }, 
     position: { 
      corner: { 
       target: 'bottomright', 
       tooltip: 'bottomleft' 
      } 
      } 
    }); 
    }); 

html--

<div class="moviebox rounded"><a href="#"> 
    <img src="http://1.bp.blogspot.com/_mySxtRcQIag/S6deHcoChaI/AAAAAAAAObc/Z1Xg3aB_wkU/s200/rising_sun.jpg" /> 
    <form method="get" action=""> 
    <input type="text" name="link" id="link" style="display:none" value="http://us.imdb.com/Title?0107969"/> 
</form> 
    </a></div> 



    <div class="moviebox rounded"><a href="#"><img src="http://2.bp.blogspot.com/_mySxtRcQIag/S6dUoGd4_TI/AAAAAAAAObM/4Mbohcy0Owo/s200/grumpy_old_men.jpg" /> 
    <form method="get" action=""> 
    <input type="text" name="link" id="link" style="display:none" value="http://us.imdb.com/Title?0107050"/> 
</form> 
</a> 

. 이 ID를 유지하는 방법은 무엇입니까?

답변

1

간단한 해결책은 id 대신 클래스를 사용하는 것입니다. 그 외에도 ID는 고유 한 것이므로 어쨌든 동일한 페이지에서 두 번 이상 사용하면 안됩니다.

+0

클래스로 변경했습니다. 스크립트가 여전히 선택할 수있는 것을 알지 못했음 – user272899

+0

글쎄, .each()를 사용하여 루프를 반복해야 할 것입니다. 가장 쉬운 방법은 $ ('. movie') 루프 안에 $ ('. link') .val()를 추가하는 것입니다. 중복성에 신경 쓸 필요가 없다면 나는 바보 같은 방법을 사용할 수 있습니다. $ ('. movie') 안에 각 루프 $ ('. link') 대신 $ ('. '.movie'). 각각 (function (x) {... data : { 'link :'+ $ ('id'+ x) .val();}} ... 그것이 작동하는지 보자. – Mon

+0

그들 사이에 구별하는 방법이 필요합니다. mon은 ID가 고유해야한다는 점에서 정확합니다 (그렇지 않은 경우 jQuery는 처음 발견 한 것을 사용합니다). – Jason

0
$('.moviebox').each(function() { 
    var imdbLink = { "link" : $(this).find("input.link").val() }; 
    $(this).qtip({ 
     // qTip code 
    }); 
}); 
+2

약간의 설명이 도움이 될 것입니다. – showdev