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表单验证(简单)
May 23 jQuery
jQuery 添加样式属性的优先级别方法(推荐)
Jun 08 jQuery
JQuery.dataTables表格插件添加跳转到指定页
Jun 09 jQuery
详解jQuery中关于Ajax的几个常用的函数
Jul 17 jQuery
简单实现jQuery弹窗效果
Oct 30 jQuery
JQuery选中select组件被选中的值方法
Mar 08 jQuery
jQuery滚动条美化插件nicescroll简单用法示例
Apr 18 jQuery
jQuery实现图片上传预览效果功能完整实例【测试可用】
May 28 jQuery
jquery 通过ajax请求获取后台数据显示在表格上的方法
Aug 08 jQuery
jQuery实现获取及设置CSS样式操作详解
Sep 05 jQuery
jquery css实现流程进度条
Mar 26 jQuery
jQuery实现简单全选框
Sep 13 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 和 MySQL 时区的一点总结
2008/03/26 PHP
PHP下打开URL地址的几种方法小结
2010/05/16 PHP
ThinkPHP3.0略缩图不能保存到子目录的解决方法
2012/09/30 PHP
Drupal7 form表单二次开发要点与实例
2014/03/02 PHP
thinkPHP多语言切换设置方法详解
2016/11/11 PHP
菜鸟学习JavaScript小实验之函数引用
2010/11/17 Javascript
JavaScript实现简单的时钟实例代码
2013/11/23 Javascript
jQuery双向列表选择器select版
2016/11/01 Javascript
Angularjs分页查询的实现
2017/02/24 Javascript
webstorm添加vue.js支持的方法教程
2017/07/05 Javascript
php中and 和 &&出坑指南
2018/07/13 Javascript
vue vue-Router默认hash模式修改为history需要做的修改详解
2018/09/13 Javascript
VUE实现可随意拖动的弹窗组件
2018/09/25 Javascript
Vue.js 图标选择组件实践详解
2018/12/03 Javascript
Vue分页器实现原理详解
2019/06/28 Javascript
javascript中layim之查找好友查找群组
2021/02/06 Javascript
python引用DLL文件的方法
2015/05/11 Python
python实现两个文件合并功能
2018/04/01 Python
python之文件读取一行一行的方法
2018/07/12 Python
对python过滤器和lambda函数的用法详解
2019/01/21 Python
python3.7 的新特性详解
2019/07/25 Python
Python3 tkinter 实现文件读取及保存功能
2019/09/12 Python
Python嵌套函数,作用域与偏函数用法实例分析
2019/12/26 Python
python为Django项目上的每个应用程序创建不同的自定义404页面(最佳答案)
2020/03/09 Python
flask框架中的cookie和session使用
2021/01/31 Python
COS美国官网:知名服装品牌
2019/04/08 全球购物
Fanatics官网:运动服装、球衣、运动装备
2020/10/12 全球购物
上海中网科技笔试题
2012/02/19 面试题
社区端午节活动方案
2014/01/28 职场文书
大学生2014全国两会学习心得体会
2014/03/10 职场文书
ktv好的活动方案
2014/08/15 职场文书
党员民主评议个人总结
2014/10/20 职场文书
企业工会工作总结2015
2015/05/13 职场文书
AI:如何训练机器学习的模型
2021/04/16 Python
go开发alertmanger实现钉钉报警
2021/07/16 Golang
如何用vue实现网页截图你知道吗
2021/11/17 Vue.js