изменение img src с помощью jquery
структура html у меня есть что-то вроде:
<ul id="something">
<li>
<a href="">
<img src="http://domain.com/directory/file1-128x79.jpg">
</a>
</li>
<li>
<a href="">
<img src="http://domain.com/directory/file2-128x79.jpg">
</a>
</li>
<li>
<a href="">
<img src="http://domain.com/directory/file3-128x79.jpg">
</a>
</li>
</ul>
Я пытаюсь изменить имя файл# - 128x79.формат JPG to файл# - 896x277.формат JPG.
Я не знаю, как взять динамически генерируемое имя файла и выполнить поиск и замену изменений src.
Я нашел способ заменить весь src на "нет", чтобы убедиться, что я получил его правильно, но я не знаю, как сделать все остальное.
$('#something').removeAttr('id').prop('class', 'some-class').find('img').prop('src', 'none');
7 ответов
можно заменить на src
для каждого img
выберите Все изображения с селектора, а затем с помощью attr
обратный вызов replace
содержание:
$('#something img').attr('src',function(i,e){
return e.replace("-128x79.jpg","-896x277.jpg");
})
вы можете назначить ID в тег как
<img id ="pic" src="http://domain.com/directory/file3-128x79.jpg">
тогда в jquery используйте
$('#pic').attr('src', 'file#-896x277.jpg');
демо
$('img').hover(function(){ // or any other method
this.src = this.src.replace("128x79", "200x60");
});
вы должны добавить .children()
до .find('img')
:
$('#something').removeAttr('id').attr('class', 'some-class').children().find('img').attr('src', 'none');
Примечание: попробуйте следующее Здесь мышь только для демонстрационной цели только
$(function() {
$("something li a img")
.mouseover(function() {
var src = "over.gif";
$(this).attr("src", src); // change the image source
})
});
Как насчет использования attr:
this.removeAttr('id').prop('class', 'featured-images').find('img').attr({‘src’:'file#-896x277.jpg’});