按照文檔使用 easyui的datagrid不顯示json格式的數據

時間  2019-12-13
標籤 按照 文檔 使用 easyui datagrid 顯示 json 格式 數據 欄目 JavaScript 简体版
原文   原文鏈接

html部分javascript

　　

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>表格</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<!-- 引入css文件，無順序 -->
<link rel="stylesheet" href="themes/icon.css" type="text/css"></link>
<link rel="stylesheet" href="themes/default/easyui.css" type="text/css"></link>

<!-- 引入js文件，有順序 -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>css

</head>
<body>

<!--
data-options是easyui特有的屬性
url表示加載json的路徑
fitColumns=true表示等分寬度，要配合width:100這個屬性值(提倡)
fitColumns=false表示不等分寬度，這時由width:100這個屬性值來決定寬度，默認爲false
singleSelect=true表示能夠選擇表格中的一項
singleSelect=false表示能夠選擇表格中的多項，默認爲false
-->
<table
style="width:400px;height:250px"
border="2"
align="center"
class="easyui-datagrid"
data-options="url:'datagrid_data.json',fitColumns:true,singleSelect:true">
<thead>
<tr>
<th data-options="field:'id',width:50">編號</th>
<th data-options="field:'name',width:50">姓名</th>
<th data-options="field:'sal',width:50">薪水</th>
<th data-options="field:'sex',width:50">性別</th>
</tr>
</thead>
</table>

</body>
</html>html

 

json java

 

　　

[
{"id":1,"name":"哈哈","sal":6000,"sex":"男"},
{"id":2,"name":"呵呵","sal":7000,"sex":"男"},
{"id":3,"name":"嘻嘻","sal":8000,"sex":"女"},
{"id":4,"name":"笨笨","sal":9000,"sex":"男"},
{"id":5,"name":"聰聰","sal":5000,"sex":"男"},
{"id":6,"name":"花花","sal":4000,"sex":"女"}
]jquery

 

很奇怪，路徑沒錯，就是不能顯示出數據來json

 

　　解決方式：查看瀏覽器的後臺信息的時候發現問題所在了，Ajax本地跨域問題 Cross origin requests are only supported for HTTP跨域

主要是瀏覽器的問題，能夠選擇換一個瀏覽器或者設置谷歌瀏覽器的啓動參數。瀏覽器

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程