jQuery로 버튼 생성

Question

jQuery를 사용하여 이미지 수를 기준으로 특정 수의 '버튼'을 만들 수 있습니까?

예 :

<ul class="gallery"> 
    <li><img src="example-one.png" /></li> 
    <li><img src="example-two.png" /></li> 
    <li><img src="example-three.png" /></li> 
</ul> 

더 이상 HTML을 추가하지 않고 세 개의 탐색 버튼을 만들 수있는 방법이 있나요? 나는 보통 자바 스크립트가 아닌 사이트의 프로그래밍 끝을한다. jQuery는 나에게 여전히 새로운 것이다.

var imageCount = jQuery('.gallery li').length; 

나에게 이미지의 수를 줄 것이다,하지만 난 거기에서 이동하는 위치에 잃었어요 :

나는 것을 알고있다.

편집 :

뭔가처럼 내가 달성하기 위해 노력하고있어 출력은 다음과 같습니다

.gallery-탐색이 이미지를 탐색하는 데 사용된다 이로써

<ul class="gallery"> 
    <li><img src="example-one.png" /></li> 
    <li><img src="example-two.png" /></li> 
    <li><img src="example-three.png" /></li> 
</ul> 
// Added with jQuery 
<ul class="gallery-nav"> 
    <li><a href="#">Button One</a></li> 
    <li><a href="#">Button Two</a></li> 
    <li><a href="#">Button Three</a></li> 
</ul> 

(예 : 클릭 ' 버튼 2 '는 example-two.png로 표시됩니다.

Answer 1

어디에서 버튼을 사용 하시겠습니까?

$('.gallery img').each(function() { 
    alert("This is image " + $(this).attr('src')); 
}); 

를 그리고 여기 수행하는 방법의 예 : 다른 일의 일의 각 위해 뭔가를하고 싶은 경우에, 당신은 다음과 같이 jQuery의 .each() 메소드를 사용할 수 있습니다 당신은 의미 http://jsfiddle.net/3HeFS/

Answer 2

은 이 : 당신이 그 버튼을 배치 할 위치를

var imageCount = jQuery('.gallery li').length; 

for(var i=0; i<imageCount; i++){ 
$('button').appendTo($('body')); 
} 

당신은 당신이 언급하지 않은 너무 때문에 다른 곳에서 버튼을 추가하려면 위의 $('body')를 교체 할 수 있습니다.

Answer 3

var names = ['One', 'Two', 'Three']; 
$('.gallery li').each(function(i, el) { 

    var oldHtml = $(this).html(); 
    $(this).empty().html('<a href="#">Button '+names[i]+'</a>'); 


});​ 

example