我的网格在 firefox 和 chrome 中工作正常，但当 gridview 设置为 true 时，它​​在 IE9 中显示“正在加载”图标。这是使用 jqgrid 4.7.0

var setGrid = $("#recordSetsGrid");
var gridView=false; //setting this to true in IE9 causes grid not to show with only message 'Loading'.

setGrid.jqGrid(
        {
            ajaxGridOptions: {cache: false},
            url : getUrlContext()+loadUrl,
            postData : {
                searchText : function() {
                    return $("#" + setSearchTextId)
                            .val();
                }
            },
            datatype : "json",
            editurl : setGrid_editUrl,
            colNames : ["","Record Set", "Origin",
                    "Origin", "Organization",
                    "Sharing", "Active?",
                    "Comments" ],
            editCaption : "Edit Record Set",
            colModel : [
                    {
                        name : "crud",
                        width : 10,
                        fixed : true,
                        editable : false,
                        search : false
                    },
                    {
                        name : "recordSet",
                        width : 65,
                        fixed : true,
                        editable : false,
                        search : false
                    },
                    {
                        name : "origin",
                        width : 90,
                        editable : true,
                        hidden : true,
                        editrules : {
                            required : false,
                            edithidden : true
                        },
                        search : true,
                        editoptions : {
                            size : "30"
                        }
                    },
                    {
                        name : "domainName",
                        width : 90,
                        editable : false,
                        search : true,
                        searchoptions : {
                            caption : "Search in record sets",
                            sopt : [ 'cn' ]
                        },
                        formatter : originFormatter,
                        editrules : {
                            required : true,
                            edithidden : false
                        }
                    },
                    {
                        name : "org",
                        width : 80,
                        align : "left",
                        editable : true,
                        search : false,
                        formatter : orgFormatter,
                        editoptions : {
                            value : orgChoices
                        },
                        edittype : "select",
                    },
                    {
                        name : "sharing",
                        width : 65,
                        fixed : true,
                        align : "left",
                        editable : true,
                        search : false,
                        editoptions : {
                            value : sharingChoices
                        },
                        edittype : "select",
                    },
                    {
                        name : "active",
                        width : 45,
                        fixed : true,
                        align : "center",
                        editable : true,
                        search : false,
                        edittype : "checkbox",
                        editoptions:{value:"Yes:No", defaultValue: "Yes"}       
                    }, 
                    {
                        name : "comments",
                        width : 80,
                        align : "left",
                        editable : true,
                        search : false,
                        editoptions : {
                            size : "60"
                        }
                    } ],
            pager : "#recordSetsGridPager",
            gridview: gridView,
            rowNum : getRecordSetInitialPageSize(),
            rowList : getRecordSetPageSizes(),
            sortname : "origin",
            sortorder : "desc",
            viewrecords : true,
            autoencode : true,
            rownumbers: true,
            height : 100,
            width : 700,
            multiselect : false,
            caption : "Record Sets",
            onSelectRow : function(ids) 
            {
                var rowData = setGrid.jqGrid("getRowData",ids);
                var origin=rowData["domainName"];
                var caption="Resource Records: "+ origin;
                if (ids == null) {
                    ids = 0;
                    if (jQuery("#recordsGrid").jqGrid('getGridParam','records') > 0) {
                        recGrid.jqGrid('setGridParam',{url:getUrlContext()+"" +
                                "/ZoneEditManaged.action?_eventName=getResourceRecords&isInit",page:1});
                        //recGrid.jqGrid('setCaption',caption).trigger('reloadGrid');
                        recGrid.trigger('reloadGrid');
                    }
                } else {
                    recGrid.jqGrid('setGridParam',{url:getUrlContext()+
                        "/ZoneEditManaged.action?_eventName=getResourceRecords&&isInit=1",page:1});
                        //"/ZoneEditManaged.action?_eventName=getResourceRecords&&isInit=1&setId="+ids,page:1});
                    //recGrid.jqGrid('setCaption',caption).trigger('reloadGrid');
                    recGrid.trigger('reloadGrid');
                }

                $("#captionOriginId").html(origin);

                //drawResourceRecordSearchBox(recGrid,caption); 
            },
            ondblClickRow : function(rowid) {
                var p = setGrid[0].p;
                if (p.selrow !== rowid) {
                    grid.jqGrid('setSelection',
                            rowid);
                }
                setGrid.jqGrid('editGridRow',
                        rowid, editProps);
            },
            loadComplete : function() {
                logMessage("In recordSetsGrid load complete");
                applyContextMenu();
                highlightFilteredData.call(this,setSearchTextId);
            },
            loadError : function(jqXHR, textStatus,
                    errorThrown) {
                handleAjaxError(jqXHR, textStatus,
                        errorThrown);
            }
        }).navGrid('#recordSetsGridPager', {
    add : true,
    edit : true,
    del : true,
    search : false
}, editProps, addProps, delProps);

如果我更改 gridView=false，它在 IE9 中运行良好。我将在这个网格中拥有大量数据，所以我读到 gridView=true 可以在大数据的情况下加快性能。任何让 gridView 在 IE9 中工作的想法都值得赞赏。

谢谢

最佳答案

@Oleg 的修改对我的类似问题很有帮助，但是我在 Internet Explorer 9 中仍然收到错误此操作的目标元素无效(在 7 中没有问题、8、10 或 11) 尝试这行代码时:

self.firstElementChild.innerHTML += rowData.join('');

但是，在设置 jqGrid 属性之后...

gridview: false

...我不再有 Internet Explorer 9 中的错误。据我所知，将 gridview 设置为 true 会同时构建表格，从而提供更快的性能，而将 gridview 设置为 false 会逐行构建它并且速度稍慢.

我不知道 jqGrid 如何将表格数据附加到 innerHTML，因为，来自 MSDN :

The innerHTML property is read-only on the col, colGroup, frameSet, html, head, style, table, tBody, tFoot, tHead, title, and tr objects.

但是，即使使用 gridview:true，它在除 IE9 之外的所有版本的 IE 中都对我有用。

这不是一个真正的答案，但希望它能帮助别人。一如既往，感谢@Oleg 对 jqGrid 的所有贡献。你对我的帮助超出了你的想象。

关于javascript - 当gridview设置为true时jqgrid在IE9中显示 'Loading'，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28089919/