使用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的递增/递减运算符和带操作的赋值运算符的等价式
Dec 08 Javascript
Jquery写一个鼠标拖动效果实现原理与代码
Dec 24 Javascript
JavaScript实现维吉尼亚(Vigenere)密码算法实例
Nov 22 Javascript
jQuery根据ID获取input、checkbox、radio、select的示例
Aug 11 Javascript
JavaScript的各种常见函数定义方法
Sep 16 Javascript
AngularJS  双向数据绑定详解简单实例
Oct 20 Javascript
详解如何提高 webpack 构建 Vue 项目的速度
Jul 03 Javascript
你有必要知道的10个JavaScript难点
Jul 25 Javascript
Angular项目中$scope.$apply()方法的使用详解
Jul 26 Javascript
JS实现碰撞检测的方法分析
Jan 19 Javascript
详解如何使用webpack打包JS
Jun 21 Javascript
Element Table的row-class-name无效与动态高亮显示选中行背景色
Nov 30 Javascript
基于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
通过ICQ网关发送手机短信的PHP源程序
2006/10/09 PHP
理解php Hash函数,增强密码安全
2011/02/25 PHP
php单文件版在线代码编辑器
2015/03/12 PHP
PHP实现基于回溯法求解迷宫问题的方法详解
2017/08/17 PHP
深入解析Laravel5.5中的包自动发现Package Auto Discovery
2017/09/13 PHP
ThinkPHP5+Layui实现图片上传加预览功能
2018/08/17 PHP
JS中字符问题(二进制/十进制/十六进制及ASCII码之间的转换)
2008/11/03 Javascript
JavaScript中的几个关键概念的理解-原型链的构建
2011/05/12 Javascript
jquery实现图片渐变切换兼容ie6/Chrome/Firefox
2013/08/02 Javascript
jQuery实现图片放大预览实现原理及代码
2013/09/12 Javascript
js对象基础实例分析
2015/01/13 Javascript
JS实现从连接中获取youtube的key实例
2015/07/02 Javascript
jQuery表单设置值的方法
2017/06/30 jQuery
使用JavaScript实现一个小程序之99乘法表
2017/09/21 Javascript
vue+koa2实现session、token登陆状态验证的示例
2019/08/30 Javascript
[03:04]2018年国际邀请赛典藏宝瓶&莱恩声望物品展示 片尾有彩蛋
2018/06/04 DOTA
python中requests爬去网页内容出现乱码问题解决方法介绍
2017/10/25 Python
Python编程中NotImplementedError的使用方法
2018/04/21 Python
Python 处理图片像素点的实例
2019/01/08 Python
不到20行代码用Python做一个智能聊天机器人
2019/04/19 Python
详解python深浅拷贝区别
2019/06/24 Python
解决pycharm 工具栏Tool中找不到Run manager.py Task的问题
2019/07/01 Python
Django-simple-captcha验证码包使用方法详解
2020/11/28 Python
python 用pandas实现数据透视表功能
2020/12/21 Python
python 第三方库paramiko的常用方式
2021/02/20 Python
使用python实现学生信息管理系统
2021/02/25 Python
浅谈h5自定义audio(问题及解决)
2016/08/19 HTML / CSS
植物选择:Botanic Choice
2017/02/15 全球购物
中间件的定义
2016/08/09 面试题
小学体育教学反思
2014/01/31 职场文书
鸿星尔克广告词
2014/03/21 职场文书
群众路线查摆问题及整改措施
2014/10/10 职场文书
公务员党的群众路线教育实践活动学习心得体会
2014/10/30 职场文书
Go Gin实现文件上传下载的示例代码
2021/04/02 Golang
MySQL复制问题的三个参数分析
2021/04/07 MySQL
Redis数据结构之链表与字典的使用
2021/05/11 Redis