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插件FusionCharts绘制2D环饼图效果示例【附demo源码】
Apr 10 jQuery
jQuery+ajax实现修改密码验证功能实例详解
Jul 06 jQuery
jQuery Collapse1.1.0折叠插件简单使用
Aug 28 jQuery
jquery自定义显示消息数量
Dec 19 jQuery
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 jQuery
Jquery和CSS实现选择框重置按钮功能
Nov 08 jQuery
用jQuery将JavaScript对象转换为querystring查询字符串的方法
Nov 12 jQuery
jQuery对底部导航进行跳转并高亮显示的实例代码
Apr 23 jQuery
JS实现点击生成UUID的方法完整实例【基于jQuery】
Jun 12 jQuery
如何使用CSS3和JQuery easing 插件制作绚丽菜单
Jun 18 jQuery
html+jQuery实现拖动滑块图片拼图验证码插件【移动端适用】
Sep 10 jQuery
Jquery 动态添加元素并添加点击事件实现过程解析
Oct 12 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使用MPDF类生成PDF的方法
2015/12/08 PHP
PhpStorm的使用教程(本地运行PHP+远程开发+快捷键)
2020/03/26 PHP
js获取变量
2006/08/24 Javascript
直接生成打开窗口代码,不必下载
2008/05/14 Javascript
深入浅析JavaScript字符串操作方法 slice、substr、substring及其IE兼容性
2015/12/16 Javascript
学习使用jquery iScroll.js移动端滚动条插件
2020/03/24 Javascript
深入理解angularjs过滤器
2016/05/25 Javascript
又一款js时钟!transform实现时钟效果
2016/08/15 Javascript
jQuery查找节点并获取节点属性的方法
2016/09/09 Javascript
详解Vue-cli 创建的项目如何跨域请求
2017/05/18 Javascript
单行 JS 实现移动端金钱格式的输入规则
2017/05/22 Javascript
JS失效 提示HTML1114: (UNICODE 字节顺序标记)的代码页 utf-8 覆盖(META 标记)的冲突的代码页 utf-8
2017/06/23 Javascript
vue this.reload 方法 配置
2018/09/12 Javascript
vue forEach循环数组拿到自己想要的数据方法
2018/09/21 Javascript
Vue使用Proxy监听所有接口状态的方法实现
2019/06/07 Javascript
JS常用排序方法实例代码解析
2020/03/03 Javascript
在elementui中Notification组件添加点击事件实例
2020/11/11 Javascript
python结合API实现即时天气信息
2016/01/19 Python
python中实现指定时间调用函数示例代码
2017/09/08 Python
Kears+Opencv实现简单人脸识别
2019/08/28 Python
Django Admin中增加导出Excel功能过程解析
2019/09/04 Python
keras获得某一层或者某层权重的输出实例
2020/01/24 Python
Superdry极度乾燥官网:日本街头风格,纯英国制造品牌
2016/10/31 全球购物
美国克罗格超市在线购物:Kroger
2019/06/21 全球购物
中式结婚主持词
2014/03/14 职场文书
师范生自我鉴定
2014/03/20 职场文书
项目投资合作意向书
2014/07/29 职场文书
见习期个人总结
2015/03/05 职场文书
《窃读记》教学反思
2016/02/18 职场文书
简短的人生哲理(38句)
2019/08/13 职场文书
2019大学生社会实践报告汇总
2019/08/16 职场文书
python 统计代码耗时的几种方法分享
2021/04/02 Python
Python生成九宫格图片的示例代码
2021/04/14 Python
python基础之函数的定义和调用
2021/10/24 Python
SQL Server实现分页方法介绍
2022/03/16 SQL Server
java.util.NoSuchElementException原因及两种解决方法
2022/06/28 Java/Android