약간 다른 이름의 중복 된 이미지

Question

파일 이름을 약간 변경하면서 이미지 파일을 복제하고 추가해야합니다.

내가 겪고있는 문제는 각 이미지에서 var가 변경되지 않는다는 것입니다. 이것은 더 많은 이미지에 대해 실행해야하므로 각 이미지의 var를 업데이트하는 방법을 찾아야합니다.

<a class="slashc-img-zoom-pan"> 
<img src="/v/vspfiles/photos/hk01344-1478-1.jpg"> 
</a> 
<a class="slashc-img-zoom-pan"> 
<img src="/v/vspfiles/photos/sc-00342-1.jpg"> 
</a> 
<a class="slashc-img-zoom-pan"> 
<img src="/v/vspfiles/photos/bs-0034-534-1.jpg"> 
</a> 

<script> 
$('a img').each(function() { 
var image_sku = $("a").html().split("-1.jpg")[0]; 
$(this).after(image_sku + '-2.jpg" >'); 
}); 
</script> 

이 결과는 다음과 같이 할 생각됩니다 : 당신의 루프 기능을 사용할 수 있습니다 어떤 프로그래밍 언어

<a class="slashc-img-zoom-pan"> 
<img src="/v/vspfiles/photos/hk01344-1478-1.jpg"> 
<img src="/v/vspfiles/photos/hk01344-1478-2.jpg"> 
</a> 
<a class="slashc-img-zoom-pan"> 
<img src="/v/vspfiles/photos/sc-00342-1.jpg"> 
<img src="/v/vspfiles/photos/sc-00342-2.jpg"> 
</a> 
<a class="slashc-img-zoom-pan"> 
<img src="/v/vspfiles/photos/bs-0034-534-1.jpg"> 
<img src="/v/vspfiles/photos/bs-0034-534-2.jpg"> 
</a> 

Answer 1

이것은 jQuery와 같습니다.

$('a.slashc-img-zoom-pan img:eq(0)').each(function(){ 
    var src = $(this).attr('src'); 
    var src2 = src.replace('-1.jpg','-2.jpg'); 
    $('<img src="' + src2 +'" >').appendTo('a.slashc-img-zoom-pan'); 
}); 

http://jsfiddle.net/jasongennaro/TUzNF/3/

설명 :

이

2. 손잡이의 src 텍스트 (두 번째를 생성되기 때문에 필요)을 IMG의 첫 번째 인스턴스를 가져
3. 교체 끝 비트
4. 부모에게 다시 추가 a

Answer 2

사용. 예를 들어, PHP에서 당신이 할 수 있습니다 : (jQuery로)

<?php 
for($i=1;$i<41;$i++) { 
    echo '<img src="/v/vspfiles/photos/hk01344-1478-'.$i.'.jpg" />'; 
} 
?> 

자바 스크립트 :

for(i=1;i<41;i++) { 
    $('#element').append('<img src="/v/vspfiles/photos/hk01344-1478-' + i + '.jpg" />'); 
} 

Answer 3

Try this: 
var x = 1; 
function CreateImage(){ 
var img = new Image(1,1); // width, height values are optional params 
img.src = '/v/vspfiles/photos/hk01344-1478-'+x; 
x = x+1; 
img_id.innerHTML += "<br/>"; 
img_id.innerHTML += img ; 
} 

할당 및 ID를, 을 태그를 고정하고 이벤트에이 함수를 호출하는 당신은 이미지를 만들고 싶습니다.

Answer 4

이 시도 :

$('a.slashc-img-zoom-pan img').each(function() { 
    var $this = $(this); 
    var image_sku = $this.attr('src').split('-1.jpg')[0]; 
    $this.after('<img src="' + image_sku + '-2.jpg">'); 
});