Question

我正在处理图片上传，我可以选择以英寸和厘米为单位选择图像大小。当用户选择英寸时，div显示尺寸为15 * 12,30 * 20的按钮，当用户选择厘米时，div为38cm * 28cm，78cm * 56cm。 div正在点击英寸和厘米的按钮。但我如何根据所选按钮设置大小。我希望当用户选择15 * 12时，图像在div中具有此大小。这是显示和隐藏英寸和厘米div的代码。

$(function () {
    var tabContainers = $('div.tabs > div');

    $('div.tabs ul.tabNavigation a').click(function () {
        tabContainers.hide().filter(this.hash).show();

        $('div.tabs ul.tabNavigation a').removeClass('selected');
        $(this).addClass('selected');

        return false;
    }).filter(':first').click();
});

Answer 1

从botton和。解析内容设置图像大小 -

$("#imageID").attr("width",width);
$("#imageID").attr("height",height);

Answer 2

使用不同的单位（如英寸和厘米）设置宽度和高度是完全合法的。你要做的只是说"3in" 3英寸，或"10cm"说10厘米。（您可以在CSS和jQuery中执行此操作。）

/* valid CSS */
img {
    width: 3in;
}

// valid jQuery
$("img").width("3in");

这里有一些简单的HTML和jQuery，可以看看如何根据点击事件设置某些内容的大小。

<img id="myImg" src="path/to/image.jpg" alt="...">
<button data-width="15in" data-height="20in">15 x 20</button>
<button data-width="20in" data-height="30in">20 x 30</button>

// Every time a <button> is clicked, resize the image to the dimensions
// given in the data-width and data-height attributes.
$("button").on("click", function () {
    var $button = $(this);
    $("#myImg").width( $button.data("width") ).height( $button.data("height") );
});

jquery点击按钮设置图像大小

2 个答案: