2 
$("#tableVisualization").jqGrid('GridUnload');

$("#tableVisualization").jqGrid({
    datatype: "local",
    mtype: 'GET', 
    colNames: this.GetGridColumnNames(),
    colModel: this.GetGridColumnModel(),
    height: "100%", 
    autowidth: true,
    shrinkToFit: true,
    sortname: 'monthID', 
    sortorder: "desc", 
    rowList: [6, 12], 
    rowNum: 12,
    pager: $('#pager3'), 
    viewrecords: true, 
    recordpos: "left", 
    caption: "Table" 
});

//local data array used for example
var data = this.GetGridData();

//FUNCTION CALL
//populate grid with data
$("#tableVisualization").jqGrid("addRowData", "month", data);

$("#tableVisualization").trigger("reloadGrid"); 

$("#tableVisualization").setGridWidth(1040, true);

上面的代码工作正常。

但是，如果我分配$("#tableVisualization")给一个变量并在上面的代码中使用该变量，它就不起作用。

//var grid = $("#tableVisualization");

它适用于每个备用呼叫。

例如，如果整个代码在一个名为 的 javascript 方法LoadGrid()中，则对该方法的第一次调用有效，第二次调用无效，第三次有效，第四次无效，依此类推。

我在调试过程中看到，当它grid.jqGrid('GridUnload')在偶数调用上达到“”时，网格被完全删除（我不确定 html 表是否被删除）并且它不是在"$("#tableVisualization").jqGrid({.....});".

谁能解释一下这种行为的原因。

我可以使场景工作，因为现在我没有使用局部变量，但我想知道为什么它不起作用？

4

1 回答 1

2

我们可以确切地看到网格GridUnload方法中发生了什么grid.custom.js：

GridUnload : function(){
    return this.each(function(){
        if ( !this.grid ) {return;}
        var defgrid = {id: $(this).attr('id'),cl: $(this).attr('class')};
        if (this.p.pager) {
            $(this.p.pager).empty().removeClass("ui-state-default ui-jqgrid-pager corner-bottom");
        }
        var newtable = document.createElement('table');
        $(newtable).attr({id:defgrid.id});
        newtable.className = defgrid.cl;
        var gid = $.jgrid.jqID(this.id);
        $(newtable).removeClass("ui-jqgrid-btable");
        if( $(this.p.pager).parents("#gbox_"+gid).length === 1 ) {
            $(newtable).insertBefore("#gbox_"+gid).show();
            $(this.p.pager).insertBefore("#gbox_"+gid);
        } else {
            $(newtable).insertBefore("#gbox_"+gid).show();
        }
        $("#gbox_"+gid).remove();
    });
},

要理解的关键点是：

  • 插入一个新table元素，其 DOMid与旧表相同。我们可以看到它在对 的调用中创建document.createElement('table')并插入到对 的调用之一中insertBefore。
  • 现有的 jqGrid DOM 在对$("#gbox_"+gid).remove(). 由于旧的 table 元素包含在 中gbox，因此它也被删除。

调用 后GridUnload，它所引用的 DOM 元素在页面上不再存在，因此任何引用该元素的代码都是无效的。

这有帮助吗？

于 2012-07-27T13:50:56.730 回答