Question

我是jquery的新手并且被困在某个地方。我有一个gridview，并在其中有一个图像列。尝试调整这些图像的大小，但实际上无法弄明白。试过这段代码，当图片不在gridview中时它很有效，但就像我说的我需要在gridview中解决它。

这是我的网格：

<asp:GridView ID="GridViewFuel" AutoGenerateColumns="false" CssClass="mGrid" runat="server" DataSourceID="EntityDataSourceFuels">
    <Columns>
        <asp:TemplateField HeaderText="Sürücü">
            <ItemTemplate>
                <%#GetDriverNameAndSurname(Convert.ToInt16(Eval("DriverId"))) %>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Araç">
            <ItemTemplate>
                <%#GetCarPlate(Convert.ToInt16(Eval("CarId"))) %>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Fiş">
            <ItemTemplate>
                <asp:Image ID="Image1" ImageUrl='<%#Eval("FuelPrice") %>' runat="server" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

这是我的jquery：

$(document).ready(function () {
        $('.mGrid img').each(function () {
            var maxWidth = 151; // Max width for the image
            var maxHeight = 151;    // Max height for the image
            var ratio = 0;  // Used for aspect ratio
            var width = $(this).width();    // Current image width
            var height = $(this).height();  // Current image height

            // Check if the current width is larger than the max
            if (width > maxWidth) {
                ratio = maxWidth / width;   // get ratio for scaling image
                $(this).css("width", maxWidth); // Set new width
                $(this).css("height", height * ratio);  // Scale height based on ratio
                height = height * ratio;    // Reset height to match scaled image
                width = width * ratio;    // Reset width to match scaled image
            }

            // Check if current height is larger than max
            if (height > maxHeight) {
                ratio = maxHeight / height; // get ratio for scaling image
                $(this).css("height", maxHeight);   // Set new height
                $(this).css("width", width * ratio);    // Scale width based on ratio
                width = width * ratio;    // Reset width to match scaled image
            }
        });
    });

如何使用gridview进行操作？

Answer 1

我会尝试循环遍历每个单元格。如果图像存在则执行您的比例。

$（'。mGrid tr'）。each（function（）{

MSXML2.ServerXMLHTTP60

}）

使用jquery调整gridview的图像大小

1 个答案: