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实现frame之间互通的方法
Jun 26 jQuery
jquery实现一个全局计时器(商城可用)
Jun 30 jQuery
jQuery选择器特殊字符与属性空格问题
Aug 14 jQuery
简单实现jQuery轮播效果
Aug 18 jQuery
jquery ajaxfileupload异步上传插件
Nov 21 jQuery
jquery学习笔记之无new构建详解
Dec 07 jQuery
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 jQuery
解决Jquery下拉框数据动态获取的问题
Jan 25 jQuery
jquery.picsign图片标注组件实例详解
Feb 02 jQuery
jQuery插件jsonview展示json数据
May 26 jQuery
jQuery实现点击自身以外区域关闭弹出层功能完整示例【改进版】
Jul 31 jQuery
jquery轻量级数字动画插件countUp.js使用详解
Oct 17 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实现弹出消息提示框的两种方法
2013/12/17 PHP
小谈php正则提取图片地址
2014/03/27 PHP
Zend Framework教程之路由功能Zend_Controller_Router详解
2016/03/07 PHP
php数值计算num类简单操作示例
2020/05/15 PHP
JS图片预加载 JS实现图片预加载应用
2012/12/03 Javascript
jquery 页眉单行信息滚动显示实现思路及代码
2014/06/26 Javascript
Javascript中arguments对象详解
2014/10/22 Javascript
JS取数字小数点后两位或n位的简单方法
2016/10/24 Javascript
requirejs + vue 项目搭建详解
2017/06/16 Javascript
基于twbsPagination.js分页插件使用心得(分享)
2017/10/21 Javascript
Angular4学习教程之HTML属性绑定的方法
2018/01/04 Javascript
如何把vuejs打包出来的文件整合到springboot里
2018/07/26 Javascript
vue 弹框产生的滚动穿透问题的解决
2018/09/21 Javascript
微信小程序页面缩放式侧滑效果的实现代码
2018/11/15 Javascript
微信小程序如何再次获取用户授权的方法
2019/05/10 Javascript
Echarts地图添加引导线效果(labelLine)
2019/09/30 Javascript
微信小程序实现点击图片放大预览
2019/10/21 Javascript
JS this关键字在ajax中使用出现问题解决方案
2020/07/17 Javascript
vue中实现点击空白区域关闭弹窗的两种方法
2020/12/30 Vue.js
Python实现一个服务器监听多个客户端请求
2018/04/12 Python
python opencv实现图片旋转矩形分割
2018/07/26 Python
python字典setdefault方法和get方法使用实例
2019/12/25 Python
Python中zipfile压缩文件模块的基本使用教程
2020/06/14 Python
Django中F函数的使用示例代码详解
2020/07/06 Python
html5中 media(播放器)的api使用指南
2014/12/26 HTML / CSS
爱他美官方海外旗舰店:Aptamil奶粉
2017/12/22 全球购物
西班牙太阳镜品牌:Hawkers
2018/03/11 全球购物
德国旅游网站:weg.de
2018/06/03 全球购物
什么是表空间(tablespace)和系统表空间(System tablespace)
2013/02/25 面试题
护理不良事件检讨书
2014/02/06 职场文书
爱岗敬业演讲稿
2014/05/05 职场文书
运动会演讲稿
2014/05/07 职场文书
献爱心标语
2014/06/21 职场文书
公司门卫工作职责
2014/06/28 职场文书
大雁塔导游词
2015/02/04 职场文书
Django cookie和session的应用场景及如何使用
2021/04/29 Python