Question

如果缩放级别不是100％并且使用小屏幕分辨率，则对于某些缩放级别，在空闲jqgrid的末尾会出现额外的空列。要重现，请打开

http://www.ok-soft-gmbh.com/jqGrid/OK/Andrus-.htm

在Chrome浏览器中，在1024x768屏幕分辨率下以67％的缩放级别显示：

对于其他一些网格布局，自由列更宽。

如何删除末尾的空列？

在早期版本中，它不会发生。

Answer 1

问题在于缩放具有1px的网格边界。结果它可以存在网格宽度和外部div的差异，小于1px，但仍然可见。

可以通过使用.getBoundingClientRect().width代替jQuery.width来解决问题，以获取网格的宽度，并在每个网格或列上的jqGrid的不同外部div上设置相同的值，从而调整大小和调整大小（更改缩放）页面。相应的代码可能如下：

var fineTuningOfWidth = function () {
        var $grid = $("#list"),
            gridWidth = $grid[0].getBoundingClientRect().width.toFixed(2) + "px",
            $gview = $grid.closest(".ui-jqgrid-view");
        $grid.closest(".ui-jqgrid-bdiv").css("width", gridWidth);
        $gview.children("div.ui-jqgrid-hdiv").css("width", gridWidth);
        $gview.css("width", gridWidth);
        $grid.closest(".ui-jqgrid").css("width", gridWidth);
    };
$("#list").jqGrid({
    datatype: "json",
    url: "andrus.json",
    colModel: [
        { label: "", name: "_actions", template: "actions" },
        { label: "Nimetus", name: "Nimi", jsonmap: "cell.0" }
    ],
    iconSet: "fontAwesome",
    jsonReader: { repeatitems: false }
}).bind("jqGridResizeStop", fineTuningOfWidth);
$(window).resize(fineTuningOfWidth);
setTimeout(fineTuningOfWidth, 150); // initial fine tuning of the width

请参阅the modified demo

如何删除空闲jqgrid末尾的额外空列

1 个答案: