дублированное изображение с немного другим именем

Question

Мне нужно продублировать файл изображения и добавить его после небольшого изменения имени файла.

Проблема, с которой я сталкиваюсь, заключается в том, что переменная не меняется с каждым изображением.Это должно будет выполняться для многих других изображений, поэтому мне нужно найти способ обновить 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

Попробуйте это:

$('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">');
});

Answer 2

Это делается с помощью 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/

Пояснение:

1. получить первый экземпляр img (необходимо, так как вы будете создавать второй)
2. получить текст src
3. заменить конечный бит
4. добавить его обратно к родителю a

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 ;
}

назначить и идентификатор привязки тега а затем вызвать эту функцию на событие, которое вы хотите создать изображение

Answer 4

Используйте любой язык программирования, который у вас есть для функциональности цикла. Например, в PHP вы можете сделать это:

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

JavaScript (с jQuery):

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