2

我正在尝试在具有相同类的 div 内裁剪图像。我正在使用以下代码:

<script type="text/javascript">
var iu = $("div.postbody").find("img").attr("src");
iu = iu.substr(0, iu.indexOf('?')) + '?width=150&height=150&crop=1%3A1';
$("div.postbody").find("img").attr("src", iu);
</script>

下面是 HTML 标记:

<div class="postbody">
<a href="#"><img src="http://1stimg.jpg?width=300"></a>
</div>
<div class="postbody">
<a href="#"><img src="http://2ndimg.jpg?width=300"></a>
</div>

使用上面的代码片段可以将原始图像从 300 像素裁剪到 150 像素,但问题是 2ndimg.jpg 正在被 1stimg.jpg 替换。无论如何要修改代码以使其在单个 div 上运行?

任何帮助是极大的赞赏。

4

3 回答 3

2

只需将您的代码应用于each图像:

$("div.postbody img").each(function() {
    var iu = this.src;
    iu = iu.substr(0, iu.indexOf('?')) + '?width=150&height=150&crop=1%3A1';
    this.src = iu;
});
于 2012-09-04T15:41:43.057 回答
1
$("div.postbody img").each(function(e) {

    var iu = $(this).attr("src");
    iu = iu.substr(0, iu.indexOf('?')) + '?width=150&height=150&crop=1%3A1';
    $(this).attr("src", iu);
});
于 2012-09-04T15:42:06.673 回答
1

.attr( attributeName, function(index, attr) )

attributeName要设置的属性的名称。

function(index, attr)返回要设置的值的函数。this是当前元素。接收集合中元素的索引位置和旧属性值作为参数。

$("div.postbody img").attr("src", function(i, cur){
     cur = cur.substr(0, cur.indexOf('?')) + '?width=150&height=150&crop=1%3A1';
     return cur;
});

小提琴

于 2012-09-04T15:47:06.853 回答