Question

我想在originalWidth和originalHeight属性中保留每个IMG宽度和高度的副本。我如何在以后使用它们将每个IMG的新大小设置为originalWidth * k，originalHeight * k？我想我应该使用lambdas或类似的东西，但是因为我是JS的新手而没有想法如何编写表达式。

$("//img[@attrName='value']").style = ???? ;

Answer 1

您可以使用data()方法

存储它们

$("img").each(function() {
    $(this).data({
        "width": $(this).width(),
        "height": $(this).height()
    });
});

Answer 2

您需要使用.each()并为每张图片单独执行此操作。

$("img[attrName='value']").each(function() { ... do stuff ....  });

Answer 3

你考虑过使用$.data吗？或者，如果您确实需要自定义，它甚至会读取HTML5 data-*自定义属性。

然后你可以在java中编写一些util函数，例如：

答案 3 :(得分：1)

var multiply_by = 2; // example

$("img[attrName='value']").each(function() { 

    // set multiplied width and height
    $(this).width($(this).width() * multiply_by) 
           .height($(this).height() * multiply_by);

});

答案 4 :(得分：1)

如果您只想获取自定义属性并使用它们为图片设置新尺寸，那么：

var k = 2; //double the size of the image
var origW = parseInt($("img").attr("originalWidth"));
var origH = parseInt($("img").attr("originalHeight"));

$("img").css("width", origW*k);
$("img").css("height", origH*k);
// or
$("img").attr("width",origW*k);
$("img").attr("height",origH*k);

答案 5 :(得分：1)

我会做这样的事情（工作jsFiddle example here）：

// To store the height and width of each image as data:
$('img').each(function() {
    $elem = $(this);
    $elem.data({
        'origHeight': $elem.height(),
        'origWidth': $elem.width()
    });
});

// To set the size of each image based on a multiplier "new_size":
function resize_images(new_size) {
    $('img').each(function() {
        $elem = $(this);
        $elem.height($elem.data('origHeight') * new_size);
        $elem.width ($elem.data('origWidth' ) * new_size);
    });
}

Answer 4

var multiply_by = 2; // example

$("img[attrName='value']").each(function() { 

    // set multiplied width and height
    $(this).width($(this).width() * multiply_by) 
           .height($(this).height() * multiply_by);

});

Answer 5

如果您只想获取自定义属性并使用它们为图片设置新尺寸，那么：

var k = 2; //double the size of the image
var origW = parseInt($("img").attr("originalWidth"));
var origH = parseInt($("img").attr("originalHeight"));

$("img").css("width", origW*k);
$("img").css("height", origH*k);
// or
$("img").attr("width",origW*k);
$("img").attr("height",origH*k);

Answer 6

我会做这样的事情（工作jsFiddle example here）：

// To store the height and width of each image as data:
$('img').each(function() {
    $elem = $(this);
    $elem.data({
        'origHeight': $elem.height(),
        'origWidth': $elem.width()
    });
});

// To set the size of each image based on a multiplier "new_size":
function resize_images(new_size) {
    $('img').each(function() {
        $elem = $(this);
        $elem.height($elem.data('origHeight') * new_size);
        $elem.width ($elem.data('origWidth' ) * new_size);
    });
}

jQuery：乘以每个IMG的大小

6 个答案: