将Json数据保存在静态脚本文件中读取
一些常用的数据例如一些网站的区域信息被改变的可能性不大,一般不通过请求获取,于是我们选择存在静态文件中,例如以下Demo:
1.动态加载Json数据显示到前台
[HttpPost]
public ActionResult GetData()
{
List<Area> areaList = new List<Area>()
{
new Area()
{
AreaID=,
AreaName="福建省",
Depth=,
cityList=new List<Area>()
{
new Area(){ AreaID=, AreaName="福州市", Depth=},
new Area(){ AreaID=, AreaName="厦门市", Depth=}
}
},
new Area()
{
AreaID=,
AreaName="四川省",
Depth=,
cityList=new List<Area>()
{
new Area(){ AreaID=, AreaName="成都市", Depth=}
}
}
};
return this.Write(Request["callback"], "", new { success = true, returnData = areaList });
}
/// <summary>
/// 转换输出
/// </summary>
/// <param name="callBack"></param>
/// <param name="paramName"></param>
/// <param name="obj"></param>
/// <returns></returns>
public ContentResult Write(string callBack, string paramName, object o)
{
Newtonsoft.Json.JsonSerializerSettings jSetting = new Newtonsoft.Json.JsonSerializerSettings();
jSetting.NullValueHandling = NullValueHandling.Ignore;
jSetting.DateFormatString = "yyyy-MM-dd HH:mm:ss";
if (callBack == "" && paramName == "")
return Content(JsonConvert.SerializeObject(o, jSetting), "application/json");
else if (callBack != "")
return Content(callBack + "(" + JsonConvert.SerializeObject(o, jSetting) + ");", "application/x-javascript");
else
return Content("var " + paramName + " = " + JsonConvert.SerializeObject(o, jSetting) + ";", "application/x-javascript");
}
<div id="main">
<ul id="ulmain"> </ul>
</div>
$.ajax({
url: '/Home/GetData',
dataType: 'jsonp',
type: 'post',
success: function (r) {
var html = '';
for (var i = 0; i < r.returnData.length; i++) {
var item = r.returnData[i];
html += '<li>' + item.AreaName + '</li>'
var hc = '';
if (item.cityList.length > 0) {
hc += '<ul>';
for (var j = 0; j < item.cityList.length; j++) {
var city = item.cityList[j];
hc += '<li>' + city.AreaName + '</li>'
}
hc += '</ul>';
}
html += hc;
}
$("#ulmain").html(html);
}
});
结果如下:

2.生成静态文件
/// <summary>
/// 生成静态JS文件
/// </summary>
/// <returns></returns>
public ActionResult CreateFile()
{ List<Area> areaList = new List<Area>()
{
new Area()
{
AreaID=,
AreaName="福建省",
Depth=,
cityList=new List<Area>()
{
new Area(){ AreaID=, AreaName="福州市", Depth=},
new Area(){ AreaID=, AreaName="厦门市", Depth=}
}
},
new Area()
{
AreaID=,
AreaName="四川省",
Depth=,
cityList=new List<Area>()
{
new Area(){ AreaID=, AreaName="成都市", Depth=}
}
}
}; Newtonsoft.Json.JsonSerializerSettings jSetting = new Newtonsoft.Json.JsonSerializerSettings();
string body = "var citylist = " + Newtonsoft.Json.JsonConvert.SerializeObject(areaList, jSetting) + ";";
System.IO.File.WriteAllText(Server.MapPath("~/Scripts/temp.js"), body, System.Text.Encoding.UTF8);
return Json(new { success = true, msg = "生成成功" }, JsonRequestBehavior.AllowGet);
}
<button id="btnCreate">
生成静态JS文件
</button>
$("#btnCreate").click(function () {
$.get("/Home/CreateFile", "", function (r) {
if (r.success)
{
alert("生成成功");
}
});
});
静态文件在~/Scripts/temp.js:

内容如下:

3.注释掉AJAX请求,指向静态文件读取数据

别忘记添加:<script src="~/Scripts/temp.js"></script>
4.最终效果展示

没有网络请求,读取的是静态文件,根据具体情况具体操作。
将Json数据保存在静态脚本文件中读取的更多相关文章
- C# 结构体和List<T>类型数据转Json数据保存和读取
C# 结构体和List<T>类型数据转Json数据保存和读取 一.结构体转Json public struct FaceLibrary { public string face_name ...
- pyhton 从web获取json数据 保存到本地然后再读取
从web中获取json数据直接进行处理总认为太慢.主要是从web中获取获取数据的过程有点慢. 所以就在想 假设先利用空暇时间把json数据获取并保存到本地,然后再从本地文件里读取和操作.应该就要快非常 ...
- SQL Server将数据导出到SQL脚本文件
http://www.studyofnet.com/news/list-8883.2-1-4.html 一.SQL Server 2008将数据导出到SQL脚本文件 1.打开SQL Server200 ...
- 一些常用的文本文件格式(TXT,JSON,CSV)以及如何从这些文件中读取和写入数据
TXT文件: txt是微软在操作系统上附带的一种文本格式,文件以.txt为后缀. 从txt文件中读取数据: with open ('xxx.txt') as file: data=file.readl ...
- java从文件中读取数据然后插入到数据库表中
实习工作中,完成了领导交给的任务,将搜集到的数据插入到数据库中,代码片段如下: static Connection getConnection() throws SQLException, IOExc ...
- shell如何传递变量到另一个脚本文件中
http://www.jbxue.com/article/shell/20707.html本文介绍了shell脚本传递变量到另一个脚本文件中的方法,在脚本中调用另一脚本,即创建了一个子进程,感兴趣的朋 ...
- 从文件中读取yuv和h264数据
1.从文件中读取h264数据 参考ffmpeg avc.c写的从文件中一帧帧读取h.264数据的demo #include <stdio.h> #include <stdlib.h& ...
- 从PCD文件中读取点云数据
博客转载自:http://www.pclcn.org/study/shownews.php?lang=cn&id=84 在本小节我们学习如何从PCD文件中读取点云数据. 代码 章例1文件夹中, ...
- 【Python】从文件中读取数据
从文件中读取数据 1.1 读取整个文件 要读取文件,需要一个包含几行文本的文件(文件PI_DESC.txt与file_reader.py在同一目录下) PI_DESC.txt 3.1415926535 ...
随机推荐
- 使用 Nodejs 搭建简单的Web服务器
使用Nodejs搭建Web服务器是学习Node.js比较全面的入门教程,因为要完成一个简单的Web服务器,你需要学习Nodejs中几个比较重要的模块,比如:http协议模块.文件系统.url解析模块. ...
- 窥探Vue.js 2.0 - Virtual DOM到底是个什么鬼?
引言 你可能听说在Vue.js 2.0已经发布,并且在其中新添加如了一些新功能.其中一个功能就是"Virtual DOM". Virtual DOM是什么 在之前,React和Em ...
- Android消息传递之基于RxJava实现一个EventBus - RxBus
前言: 上篇文章学习了Android事件总线管理开源框架EventBus,EventBus的出现大大降低了开发成本以及开发难度,今天我们就利用目前大红大紫的RxJava来实现一下类似EventBus事 ...
- “fixed+relative==absolute”——对BFC的再次思考
好久没写博客了,刚好今天跨年夜没约到什么妹子,在家宅着不如写点东西好了. 需求 昨天晚上,给公司年会做一个移动端的投票页面,遇到一个UI优化的问题: · 正文内容少于一屏时,投票提交按钮固定显示在页面 ...
- Spring中Bean的作用域、生命周期
Bean的作用域.生命周期 Bean的作用域 Spring 3中为Bean定义了5中作用域,分别为singleton(单例).protot ...
- iOS controller解耦探究实现——第一次写博客
大学时曾经做过android的开发,目前的工作是iOS的开发.之前自己记录东西都是通过自己比较喜欢的笔记类的应用记录下了.直到前段时一个哥们拉着我注册了一个博客.现在终于想明白了,博客这个东西受众会稍 ...
- ASP.NET MVC关于Ajax以及Jquery的无限级联动
---恢复内容开始--- 第一次发表博文,发表博文的目的是巩固自己的技术,也能够共享给大家.写的不好的地方,希望大家多给给意见.老司机勿喷 数据结构() NewsTypeId 新闻ID, NewsTy ...
- HTML简单入门内容
常用属性: Width=宽度 Height=高度 Size=大小 Color=颜色 Align=布局方向,值包括(top,bottom,left,right,center)上,下,左,右,中. Bor ...
- css3更改input单选和多选的样式
在项目开发中我们经常会遇到需要更改input单选和多选样式的情况,今天就给大家介绍一种简单改变input单选和多选样式的办法. 在这之前先简单介绍一下:before伪类 :before 选择器向选定的 ...
- 用Swagger生成接口文档
Swagger简介 在系统设计的时候,各个应用之间往往是通过接口进行交互的.因此接口的定义在整个团队中就变得尤为重要.我们可以把接口的规范用接口描述语言进行描述,然后Swagger可以根据我们定义的接 ...