jQuery 배열을 통해 반복을 클릭하십시오.

Question

나는 해결책을 찾기 위해 모든 곳을 보려고했지만 어떻게 제대로 수행되는지 이해할 수 없습니다. 본질적으로 데이터를 가져 오려는 XML이 있습니다. 페이지가 첫 번째 항목을로드하도록하고 싶습니다. 사용자가 앞으로 버튼을 클릭하면 XML을 반복하여 끝에 도달 할 때까지 반복합니다. 뒤로 단추도 마찬가지입니다.

$(document).ready(function(){ 
     var name = []; 
     var description = []; 
     var html_screenshot_01 = []; 
     var html_screenshot_02 = []; 
     var site_link = []; 
     var source_link = []; 
     var demo_link = []; 

     $.ajax({ 
      type: "GET", 
      url: "projects_html.xml", 
      dataType: "xml", 
      success: function(xml) { 
       $(xml).find('name').each(function(){ name.push($(this).text()); }); 
       $(xml).find('description').each(function(){ description.push($(this).text()); }); 
       $(xml).find('html_screenshot_01').each(function(){ html_screenshot_01.push($(this).text()); }); 
       $(xml).find('html_screenshot_02').each(function(){ html_screenshot_02.push($(this).text()); }); 
       $(xml).find('site_link').each(function(){ site_link.push($(this).text()); }); 
       $(xml).find('source_link').each(function(){ source_link.push($(this).text()); }); 
       $(xml).find('demo_link').each(function(){ demo_link.push($(this).text()); });     

       $(xml).find('projects').each(function(){ 


        $('#name').empty().append(name[0]); 
        $('#description').empty().append(description); 
        $("img#html_screenshot_01").attr("src", html_screenshot_01); 
        $("img#html_screenshot_02").attr("src", html_screenshot_02); 
        $("a#site_link").attr("src", site_link); 
        $("a#source_link").attr("src", source_link); 
        $("a#demo_link").attr("src", demo_link);  

        $('a#site_link').filter(function() {return $.trim($(this).text()) === ''}).css("visibility", "hidden") 
        $('a#source_link').filter(function() {return $.trim($(this).text()) === ''}).css("visibility", "hidden")      
        $('a#demo_link').filter(function() {return $.trim($(this).text()) === ''}).css("visibility", "hidden") 
       }); 
      } 
     }); 
     $("#next").click(function() { 
      var i = 0; 
      i++; 
      $('#name').empty().append(name[i]); 
      return false; 
     }); 
     $("#back").click(function() { 
      alert('back'); 
     }); 
    }); 

Answer 1

이동하면 다음 클릭 이벤트

. 
. 

var i = 0; 
$("#next").click(function() { 
. 
. 
.