Question

我的jqgrid根本没有显示。我是新手，所以任何解释都表示赞赏我的页面在下面，据我所知，我有所有必要的文件等，并且没有一个在Chrome中404。我应该补充说我正在使用Eclipse和Spring。我在Chrome中看到的错误会跟随底部的页面信息。它们似乎只是一些语法错误，但我有一种欺骗性的感觉。

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page session="false" %>
<html>
<head>
    <link rel="stylesheet" type="text/css" media="screen" href="resources/jqgrid/css/smoothness/ui-lightness/jquery-ui-1.10.0.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="resources/jqgrid/css/ui.jqgrid.css" />

<script type="text/javascript" src="resources/jqgrid/js/jquery/jquery-1.4.2.min.js"></script>
<!--  
<script type="text/javascript">
    var $jq = jQuery.noConflict();
</script>
-->
<script type="text/javascript" src="resources/js/jquery/jquery-ui-1.8.6.custom.min.js"></script> 
<script type="text/javascript" src="resources/jqgrid/js/grid.locale-en.js" ></script>
<script type="text/javascript" src="resources/jqgrid/js/jquery.jqGrid.min.js"></script>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

 <script type="text/javascript">
$(function() {
    $("#grid").jqGrid({
        url:'/listgrid',
        datatype: 'json',
        mtype: 'GET',
        colNames:['Title', 'Description', 'Release Year'],
        colModel:[
            {name:'title',index:'title', width:55,editable:false,editoptions:{readonly:true,size:10},hidden:true},
            {name:'description',index:'description', width:100,editable:true, editrules:{required:true}, editoptions:{size:10}},
            {name:'release_year',index:'release_year', width:100,editable:true, editrules:{required:true}, editoptions:{size:10}}
        ],
        postData: { 
        },
        rowNum:20,
        rowList:[20,40,60],
        height: 200,
        autowidth: true,
        rownumbers: true,
        pager: '#pager',
        sortname: 'title',
        viewrecords: true,
        sortorder: "asc",
        caption:"Movies",
        emptyrecords: "Empty records",
        loadonce: false,
        loadComplete: function() {
        },
        jsonReader : {
            root: "rows",
            page: "page",
            total: "total",
            records: "records",
            repeatitems: false,
            cell: "cell",
            id: "id"
        }
    });


});
  </script>


<title>Home</title>
   </head>
   <body>


<h1>
Hello  world!  
</h1>

<P>  The time on the server is ${serverTime}. </P>

<p>JqGrid - Spring 3 MVC Integration Tutorial</p>
<div id="jqgrid">
<table id="grid"></table>
<div id="pager"></div>
</div>
</body>
</html>

我看到的错误是：

Resource interpreted as Script but transferred with MIME type text/html:
"http://localhost:8080/movies/resources/jqgrid/js/jquery.jqGrid.min.js". localhost:8
Resource interpreted as Stylesheet but transferred with MIME type text/html:
"http://localhost:8080/movies/resources/jqgrid/css/ui.jqgrid.css". localhost:6
Resource interpreted as Stylesheet but transferred with MIME type text/html:
"http://localhost:8080/movies/resources/jqgrid/css/smoothness/ui-lightness/jquery-ui-1.10.0.custom.css". localhost:5
Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:8080/movies/resources/jqgrid/js/jquery/jquery-1.4.2.min.js". localhost:8
 Uncaught SyntaxError: Unexpected token < :8080/movies/resources/jqgrid/js/jquery/jquery-1.4.2.min.js:3
  Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:8080/movies/resources/js/jquery/jquery-ui-1.8.6.custom.min.js". localhost:8 Uncaught SyntaxError: Unexpected token < :8080/movies/resources/js/jquery/jquery-ui-1.8.6.custom.min.js:3
  Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:8080/movies/resources/jqgrid/js/grid.locale-en.js". localhost:8
   Uncaught SyntaxError: Unexpected token < :8080/movies/resources/jqgrid/js/grid.locale-en.js:3
  Uncaught SyntaxError: Unexpected token < jquery.jqGrid.min.js:3
  Uncaught ReferenceError: $ is not defined localhost:21

Answer 1

我自己不使用Eclipse或Spring。所以我无法帮到你。不过，您可以在发布的代码中看到一些问题。例如，您使用

之类的结构

<link ... />

和

<!-- ... -->

为什么您认为您的代码应该被解释为XHTML？您必须在 <html>之前添加其他!DOCTYPE ，以强制在quirks mode中将代码解释为XHTML而不是HTML。例如，您可以包含

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

之后，我建议您将JavaScript代码始终放在//<![CDATA[之间和//]]>：

<script type="text/javascript"> //<![CDATA[ $(function() { .... //]]> </script>

如果您确定可以在XHTML页面上包含任何 JavaScript代码。

此外，在不同版本的jQuery UI之间使用混合非常糟糕。您将jquery-ui-1.10.0.custom.css与jquery-ui-1.8.6.custom.min.js一起使用。此外，您使用非常旧的版本的jQuery（jquery-1.4.2.min.js）。您应该阅读哪个版本的jQuery UI将完全支持。例如，jQuery UI 1.10.0和jQuery UI 1.9.2支持版本1.6及更高版本的jQuery。如果你真的需要使用旧的1.4.2版本的jQuery，你必须使用jQuery UI 1.8.x.在这种情况下，我建议您使用jQuery UI 1.8.24。

我自己不使用Eclipse或Spring。因此，我无法帮助您解决设置错误的MIME类型text / html的问题。您应该更仔细地比较正确工作的代码与当前有问题的代码。或者你应该在stackoverflow上提出新的问题，但是为它使用另一个标签。

Answer 2

您有语法错误，通常这可以防止其他脚本运行s，修复错误＆amp;你可能会有更多的运气。

jqgrid没有显示

2 个答案: