使用JavaScript获取Django模板指定键值数据


Posted in Javascript onMay 27, 2020

Django中利用js来操作数据的常规操作一般为点(.)操作符来获取字典或列表的数据,一般如{{data.0}},{{data.arg}}

但有时如果数据是嵌套类型的数据时,直接获取某个值就变得困难了,比如下面的格式要获取

correct中qxl的值

startArgsSet={"correct":{"qxl":0,"kkx":0},"reliable":{"qxl":0,"kkx":0},"security":{"qxl":0,"kkx":0},"understand":{"qxl":0,"kkx":0},"entropy":{"qxl":0,"kkx":0},
"mature":{"qxl":0,"kkx":0},"active":{"qxl":0,"kkx":0},"service":{"qxl":0,"kkx":0},"file":{"qxl":0,"kkx":0},
"tech":{"qxl":0,"kkx":0},"property":{"qxl":0,"kkx":0},"organize":{"qxl":0,"kkx":0},"develop":{"qxl":0,"kkx":0},
"source":{"qxl":0,"kkx":0},"update":{"qxl":0,"kkx":0},"fix":{"qxl":0,"kkx":0},
"quality":{"qxl":0,"kkx":0},"meanNum":{"qxl":0,"kkx":0},"variance":{"qxl":0,"kkx":0}
}

这时候如果改变数据格式为列表中的无嵌套字典格式比较麻烦,可以自定义过滤器来获取数据,

from django.template.defaulttags import register

@register.filter
def getArgQxlValue(dictionary,arg):
  return dictionary[arg]['qxl']
  
@register.filter
def getArgKkxValue(dictionary,arg):
  return dictionary[arg]['kkx']
  
@register.filter
def getArgName(dictionary,arg):
  return dictionary[arg]['name']

在模板中就可以以这样写

<!-- the second important page of the project-->
{% load staticfiles %}

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>超标信息</title>

   <script src="{% static 'js/a-mynewjs.js' %}"></script>

</head>

<body>

 {{ guestSetArgs|safe }}<br><br><br>
 
 {{ warningdata|safe }}<br><br>
 
 <script>
 {% for i in guestSetArgs %}
  {% for j in warningdata %} 
    if("{{i}}"=="{{j}}")
    {
      if(Number({{warningdata|getArgQxlValue:j}})>Number({{guestSetArgs|getArgQxlValue:i}}))
      var setArgStr="{{warningdata|getArgName:i}} 超出阀值  阀值:{{guestSetArgs|getArgQxlValue:j}}  检测值:{{warningdata|getArgQxlValue:j}}<br>"
      document.write(setArgStr);
    }
    
  {% endfor %} 
 {% endfor %} 
 
  </script>
</body>
</html>

形如{{warningdata|getArgQxlValue:j}},就可以获取到里面的值了

使用JavaScript获取Django模板指定键值数据

稍做美化

使用JavaScript获取Django模板指定键值数据

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js身份证验证超强脚本
Oct 26 Javascript
用正则表达式 动态创建/增加css style script 兼容IE firefox
Mar 10 Javascript
javascript 类方法定义还是有点区别
Apr 15 Javascript
JQuery Dialog的内存泄露问题解决方法
Jun 18 Javascript
JavaScript中window、doucment、body的解释
Aug 14 Javascript
vue环境搭建简单教程
Nov 07 Javascript
jquery获取transform里的值实现方法
Dec 12 jQuery
react以create-react-app为基础创建项目
Mar 14 Javascript
JavaScript实现更换背景图片
Oct 18 Javascript
jQuery实现验证用户登录
Dec 10 jQuery
javascript使用正则表达式实现注册登入校验
Sep 23 Javascript
如何使用vue3打造一个物料库
May 08 Vue.js
基于Vue CSR的微前端实现方案实践
May 27 #Javascript
Node.js API详解之 vm模块用法实例分析
May 27 #Javascript
jQuery实现鼠标滑动切换图片
May 27 #jQuery
js验证账户名是否重复
May 26 #Javascript
小程序富文本提取图片可放大缩小
May 26 #Javascript
微信小程序自定义联系人弹窗
May 26 #Javascript
微信小程序单选框自定义赋值
May 26 #Javascript
You might like
PHP函数addslashes和mysql_real_escape_string的区别
2014/04/22 PHP
PHP入门教程之图像处理技巧分析
2016/09/11 PHP
js 页面执行时间计算代码
2009/03/04 Javascript
jQuery 跨域访问问题解决方法
2009/12/02 Javascript
javascript 进阶篇1 正则表达式,cookie管理,userData
2012/03/14 Javascript
js中单引号与双引号冲突问题解决方法
2013/10/04 Javascript
jquery修改属性值实例代码(设置属性值)
2014/01/06 Javascript
javascript实例--教你实现扑克牌洗牌功能
2014/05/15 Javascript
javascript检测flash插件是否被禁用的方法
2016/01/14 Javascript
基于JS实现EOS隐藏错误提示层代码
2016/04/25 Javascript
webpack3之loader全解析
2017/10/26 Javascript
vue favicon设置以及动态修改favicon的方法
2018/12/21 Javascript
JavaScript自动生成 年月范围 选择功能完整示例【基于jQuery插件】
2019/09/03 jQuery
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
2019/11/15 Javascript
vue+axios全局添加请求头和参数操作
2020/07/24 Javascript
[01:23:35]Ti4主赛事胜者组 DK vs EG 1
2014/07/19 DOTA
Python中变量交换的例子
2014/08/25 Python
python插入排序算法实例分析
2015/07/03 Python
详解Python pygame安装过程笔记
2017/06/05 Python
Python实现的堆排序算法原理与用法实例分析
2017/11/22 Python
全面了解Nginx, WSGI, Flask之间的关系
2018/01/09 Python
python识别文字(基于tesseract)代码实例
2019/08/24 Python
keras获得某一层或者某层权重的输出实例
2020/01/24 Python
基于Python生成个性二维码过程详解
2020/03/05 Python
Python loguru日志库之高效输出控制台日志和日志记录
2020/03/07 Python
利用python清除移动硬盘中的临时文件
2020/10/28 Python
介绍一下Cookie和Session及他们之间的区别
2012/11/20 面试题
本科毕业生自我鉴定
2013/11/02 职场文书
十八届三中全会宣传方案
2014/02/21 职场文书
《第一朵杏花》教学反思
2014/04/16 职场文书
2014年班干部工作总结
2014/11/25 职场文书
追悼会答谢词
2015/01/05 职场文书
体育教师个人总结
2015/02/09 职场文书
企业财务总监岗位职责
2015/04/03 职场文书
导游词之井冈山
2019/11/20 职场文书
python数字图像处理实现图像的形变与缩放
2022/06/28 Python