ajax读本地文件
前置条件:
1. 编辑器,我用的是HbuilderX,解压即食,非常美味,点击传送门。
2. jQuery.min.js,点击传送门。
简单的项目目录:

a. test.html内容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<script src="jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="showData"></div> <script type="text/javascript">
$(function() {
$.ajax({
type: "get", //请求方式
url: "test.json", //文件地址
success: function(data) { //成功返回
var str = JSON.stringify(data);
$(".showData").text(str); //将数据写在页面,方便观看(转为了文本格式) console.log(data); //也可以在控制台看数据
},
error: function(e) { //失败返回
console.log(e.statusText);
}
});
});
</script>
</body>
</html>
b. test.json
[
{
"name" : "aaa",
"age" : "16"
},
{
"name" : "bbb",
"age" : "15"
}
]
c. 文件准备就绪后,点击执行即可【如若本地直接双击test.html文件,则会有跨域报错。需要从编辑器(如:HbuilderX)打开。】



至此,ajax读取本地数据成功。(后续将会探究如何将数据写入本地文件,以及本地数据的增删改查。)
【赠人以赞,手有余香!嘿嘿...】
ajax读本地文件的更多相关文章
- IE8/9 JQuery.Ajax 上传文件无效
IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...
- springMVC+jsp+ajax上传文件
工作中遇到的小问题,做个笔记 实现springMVC + jsp + ajax 上传文件 HTML <body> <form id="myform" method ...
- [Ajax] 使用Ajax异步上传图片文件(非Form表单提交)
通过表单Form提交来上传文件的方式这里就不说了: 下面介绍,通过js中使用ajax异步上传图片文件: 新建一个html页面和一个一般处理程序即可: 涉及思路: //发送2次Ajax请求完成js异步上 ...
- Ajax上传文件进度条显示
要实现进度条的显示,就要知道两个参数,上传的大小和总文件的大小 html5提供了一个上传过程事件,在上传过程中不断触发,然后用已上传的大 小/总大小,计算上传的百分比,然后用这个百分比控制div框的显 ...
- 通过Jquery中Ajax获取json文件数据
1. JSON(JavaScript Object Notation): javaScript对象表示法: 是存储和交换文本信息的语法,比xml更小,更快,更易解析. 2. JSON基本书写格式 : ...
- 伪ajax上传文件
伪ajax上传文件 最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...
- Ajax实现xml文件数据插入数据库(一)--- 构建解析xml文件的js库
Ajax实现将xml文件数据插入数据库的过程所涉及到的内容比较多,所以对于该过程的讲解本人打算根据交互的过程将其分为三个部分,第一部分为构建解析xml文件的javascript库,第二部分为ajax与 ...
- Ajax实现xml文件数据插入数据库(二)--- ajax实现与jsp的数据交互。
在上一篇文章中我们成功得到了重新组织后的数据,接下来需要做的便是将数据插入到数据库中了.在与数据库打交道的过程中有一些方法是普遍的,我们将这些通用方法封装到一个DbUtil类中,以便复用,封装好的Db ...
- 移动端通过ajax上传图片(文件)并在前台展示——通过H5的FormData对象
前些时候遇到移动端需要上传图片和视频的问题,之前一直通过ajax异步的提交数据,所以在寻找通过ajax上传文件的方法.发现了H5里新增了一个FormData对象,通过这个对象可以直接绑定html中的f ...
随机推荐
- 《剑指offer》面试题67. 把字符串转换成整数
问题描述 写一个函数 StrToInt,实现把字符串转换成整数这个功能.不能使用 atoi 或者其他类似的库函数. 首先,该函数会根据需要丢弃无用的开头空格字符,直到寻找到第一个非空格的字符为止. ...
- linux目录作用
/ 根目录 /bin 命令保存目录(普通用户就可以使用的命令) /sbin 命令保存目录(超级用户才能使用的命令) /boot 启动目录,启动相关文件 /dev 设备文件保存目录 /etc 配置文件保 ...
- X-Y问题(X-Y problem)
X-Y Problem 什么是X-Y problem呢? 某人想要解决问题X 他认为Y可能是解决X问题的方法 但是他不知道Y怎么做 于是他去问别人Y应该怎么做 这就产生了一个X-Y problem 也 ...
- python闭包函数&装饰器
一.函数引用 函数可以被引用 函数可以被赋值给一个变量 def hogwarts(): print("hogwarts") # hogwarts() # 函数调用 print(ho ...
- WebGPU图形编程(4):构建一个彩色的正方形<学习引自徐博士教程>
本节我们来复原一个彩色的正方形,前提告知,本节的shaders和main的代码从结构上有调整,我会更加详细的描述每行的代码意思: 源代码下载地址:https://github.com/jack1232 ...
- golang中闭包讲解
1. 非闭包时的结果 package main import "fmt" func main() { var funcSlice []func() for i := 0; i &l ...
- Tomcat-IDEA整合Tomcat服务器
Tomcat(IDEA整合Tomcat服务器) 可以加多个版本tomcat
- GoLang设计模式20 - 组合模式
定义 组合模式是一种结构型设计模式. 当我们想把一组对象当做一个整体来处理时就可以考虑使用组合模式. 组合模式被视为是接口型设计模式是因为它将一组对象组装为一个树状结构.这个树状结构中的每个独立组件都 ...
- 如何使用自对弈强化学习训练一个五子棋机器人Alpha Gobang Zero
前言 2016年3月,Alpha Go 与围棋世界冠军.职业九段棋手李世石进行围棋人机大战,以4比1的总比分获胜,在当时引起了轩然大波.2017年10月,谷歌公布了新版五子棋程序 AlphaGo Ze ...
- ApacheCN - 关于我们
1.简单介绍一下 ApacheCN? ApacheCN 是 2016 年 8 月份就开始搭建网站雏形, 2017 年 6 月份正式全职来做,是国内第一个有组织性.敢带人装逼.敢真的分享.并且敢戴绿帽的 ...