jquery将json转为数据字典的实例代码


Posted in jQuery onOctober 11, 2019

1.基础——定义json文件

{
 "userinfo": [
 { "account":"15639864589" , "password":"123456789" , "email":"123456789@qq.com" },
 { "account":"15652689689" , "password":"123456789" , "email":"123456789@qq.com" },
 { "account":"15635456989" , "password":"123456789" , "email":"123456789@qq.com" },
 { "account":"15632145689" , "password":"123456789" , "email":"123456789@qq.com" }
 ]
}

目录如下:

jquery将json转为数据字典的实例代码

2.ajax请求json jquery转换为数据字典

我们通过ajax请求该json文件的数据  将其转换为字典

//-----基础信息start
//用户信息字典
var userinfoDic = {};
$.ajax({
 //请求方式为get
 type:"GET",
 //json文件位置
 url:"./json/user.json",
 //返回数据格式为json
 dataType: "json",
 //请求成功完成后要执行的方法
 success: function(data){
 //使用$.each方法遍历返回的数据date
 $.each(data.userinfo,function(i,item){
 //设置根据用户账号密码找用户
 userinfoDic[item.account,item.password] = item;
 });
 }
});
//-----基础信息end

3.字典测试

//登录按钮的点击事件
$("#login").bind('click',function(){
 var account = $("#account").val();
 var password = $("#password").val();
 //
 if(account != '' && password != ''){
  if(userinfoDic[account,password]){
  window.location.href = 'index.html';
  }else{
  alert("账号或密码错误!");
  }
 }else{
 alert("账号或密码不能为空!");
 }
  
});

4.测试截图

jquery将json转为数据字典的实例代码

总结

以上所述是小编给大家介绍的jquery将json转为数据字典的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

jQuery 相关文章推荐
为JQuery EasyUI 表单组件增加焦点切换功能的方法
Apr 13 jQuery
jQuery操作css样式
May 15 jQuery
原生js jquery ajax请求以及jsonp的调用方法
Aug 04 jQuery
JQuery 选择器、DOM节点操作练习实例
Sep 28 jQuery
jquery在启动页面时,自动加载数据的实例
Jan 22 jQuery
vue+jquery+lodash实现滑动时顶部悬浮固定效果
Apr 28 jQuery
jQuery序列化form表单数据为JSON对象的实现方法
Sep 20 jQuery
jQuery实现数字自动增加或者减少的动画效果示例
Dec 11 jQuery
jQuery层叠选择器用法实例分析
Jun 28 jQuery
Javascript和jquery在selenium的使用过程
Oct 31 jQuery
jquery实现点击弹出对话框
Feb 08 jQuery
jquery实现手风琴案例
May 04 jQuery
js判断复选框是否选中的方法示例【基于jQuery】
Oct 10 #jQuery
jquery获取并修改触发事件的DOM元素示例【基于target 属性】
Oct 10 #jQuery
jQuery实现提交表单时不提交隐藏div中input的方法
Oct 08 #jQuery
jQuery 筛选器简单操作示例
Oct 02 #jQuery
jQuery 查找元素操作实例小结
Oct 02 #jQuery
layui+jquery支持IE8的表格分页方法
Sep 28 #jQuery
jquery 回调操作实例分析【回调成功与回调失败的情况】
Sep 27 #jQuery
You might like
php正则
2006/07/07 PHP
PHP用SAX解析XML的实现代码与问题分析
2011/08/22 PHP
PHP Ajax跨域问题解决方案代码实例
2020/08/01 PHP
DOM相关内容速查手册
2007/02/07 Javascript
jquery 可排列的表实现代码
2009/11/13 Javascript
JavaScript中的作用域链和闭包
2012/06/30 Javascript
解析页面加载与js函数的执行 onload or ready
2013/12/12 Javascript
JQuery入门基础小实例(1)
2015/09/17 Javascript
js中DOM三级列表(代码分享)
2017/03/20 Javascript
ztree实现左边动态生成树右边为内容详情功能
2017/11/03 Javascript
在vue中添加Echarts图表的基本使用教程
2017/11/22 Javascript
详解vue2.0+vue-video-player实现hls播放全过程
2018/03/02 Javascript
vue页面加载闪烁问题的解决方法
2018/03/28 Javascript
angular4 共享服务在多个组件中数据通信的示例
2018/03/30 Javascript
vue构建动态表单的方法示例
2018/09/22 Javascript
微信小程序使用wx.request请求服务器json数据并渲染到页面操作示例
2019/03/30 Javascript
浅谈一个webpack构建速度优化误区
2019/06/24 Javascript
javascript设计模式 ? 建造者模式原理与应用实例分析
2020/04/10 Javascript
Node.js API详解之 repl模块用法实例分析
2020/05/25 Javascript
el-form 多层级表单的实现示例
2020/09/10 Javascript
详解nginx配置vue h5 history去除#号
2020/11/09 Javascript
[01:32]完美世界DOTA2联赛10月29日精彩集锦
2020/10/30 DOTA
深入解析Python中的urllib2模块
2015/11/13 Python
python的构建工具setup.py的方法使用示例
2017/10/23 Python
Python人脸识别初探
2017/12/21 Python
pycharm+PyQt5+python最新开发环境配置(踩坑)
2019/02/11 Python
详解如何在cmd命令窗口中搭建简单的python开发环境
2019/08/29 Python
python中的itertools的使用详解
2020/01/13 Python
详解pandas.DataFrame.plot() 画图函数
2020/06/14 Python
利用Python如何制作贪吃蛇及AI版贪吃蛇详解
2020/08/24 Python
微软俄罗斯官方网站:Microsoft俄罗斯
2016/09/18 全球购物
金牌葡萄酒俱乐部:Gold Medal Wine Club
2017/11/02 全球购物
《我要的是葫芦》教学反思
2014/02/23 职场文书
2014年医院后勤工作总结
2014/12/06 职场文书
老公保证书怎么写
2015/02/26 职场文书
canvas绘制折线路径动画实现
2021/05/12 Javascript