Django之PopUp的具体实现方法


Posted in Python onAugust 31, 2019

步骤一:index页面处理

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>首页</title>
</head>
<body>
<div id="hhh">hello</div>
<a href="" onclick=" rel="external nofollow" punch('/pop/')">点我点我</a>
</body>
<script>
  function punch(url) {
    window.open(url,url,"status=1,width:500,height:600,toolbar=0,resizeable=0")
  }
  function callbackns(text) {
    document.getElementById('hhh').innerText = text
  }
</script>
</html>

步骤二:配置路由

urlpatterns = [
  path('admin/', admin.site.urls),
  path('index/', views.index),
  path('pop/', views.pop),
]

步骤三:视图函数

from django.shortcuts import render


# Create your views here.
def index(request):
  """
  :param request:
  :return:
  """
  return render(request, 'test1.html')


def pop(request):
  """
  :param request:
  :return:
  """
  if request.method == 'GET':
    return render(request, 'test2.html')
  else:
    text = request.POST.get('content')

    return render(request, 'test3.html', {'text': text})

步骤四:构建一个前端页面

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>pop页面</title>
</head>
<body>
<form action="" method="post">
  {% csrf_token %}
  <input type="text" name="content">
  <input type="submit" value="提交">
</form>
</body>
</html>

步骤五:自执行函数处理

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>正在关闭...</title>
</head>
<body>
<script>

  (function () {
    opener.callbackns("{{ text }}");
    window.close()
  })()

</script>
</body>
</html>

步骤六:关闭当前窗口并执行

function callbackns(text) {
  document.getElementById('hhh').innerText = text
 }

以上这篇Django之PopUp的具体实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Python 相关文章推荐
Python不规范的日期字符串处理类
Jun 10 Python
使用Python的web.py框架实现类似Django的ORM查询的教程
May 02 Python
Python随手笔记第一篇(2)之初识列表和元组
Jan 23 Python
python实现获取Ip归属地等信息
Aug 27 Python
python3实现全角和半角字符转换的方法示例
Sep 21 Python
树莓派使用USB摄像头和motion实现监控
Jun 22 Python
python实现图片九宫格分割
Mar 07 Python
django-rest-swagger对API接口注释的方法
Aug 29 Python
Python模块汇总(常用第三方库)
Oct 07 Python
Python pygame绘制文字制作滚动文字过程解析
Dec 12 Python
Python bisect模块原理及常见实例
Jun 17 Python
如何将numpy二维数组中的np.nan值替换为指定的值
May 14 Python
对django layer弹窗组件的使用详解
Aug 31 #Python
python2.7实现复制大量文件及文件夹资料
Aug 31 #Python
python3实现高效的端口扫描
Aug 31 #Python
python nmap实现端口扫描器教程
May 28 #Python
Python3多线程版TCP端口扫描器
Aug 31 #Python
简单了解python协程的相关知识
Aug 31 #Python
利用rest framework搭建Django API过程解析
Aug 31 #Python
You might like
浅析linux下apache服务器的配置和管理
2013/08/10 PHP
php采用file_get_contents代替使用curl实例
2014/11/07 PHP
CI框架扩展系统核心类的方法分析
2016/05/23 PHP
javascript开发随笔二 动态加载js和文件
2011/11/25 Javascript
对Jquery中的ajax再封装,简化操作示例
2014/02/12 Javascript
javascript实现全角与半角字符的转换
2015/01/07 Javascript
js判断浏览器版本以及浏览器内核的方法
2015/01/20 Javascript
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证
2015/06/25 Javascript
javascript移动开发中touch触摸事件详解
2016/03/18 Javascript
JS简单生成两个数字之间随机数的方法
2016/08/03 Javascript
Bootstrap时间选择器datetimepicker和daterangepicker使用实例解析
2016/09/17 Javascript
JS限制条件补全问题实例分析
2016/12/16 Javascript
bootstrap可编辑下拉框jquery.editable-select
2017/10/12 jQuery
关闭Vue计算属性自带的缓存功能方法
2018/03/02 Javascript
vue内置组件transition简单原理图文详解(小结)
2018/07/12 Javascript
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
2019/06/17 Javascript
使用vue实现一个电子签名组件的示例代码
2020/01/06 Javascript
[02:51]2014DOTA2 TI小组赛总结中国军团全部进军钥匙球馆
2014/07/15 DOTA
[01:38]DOTA2辉夜杯 欢乐的观众现场采访
2015/12/26 DOTA
python 查找文件夹下所有文件 实现代码
2009/07/01 Python
Python的函数的一些高阶特性
2015/04/27 Python
Python聚类算法之基本K均值实例详解
2015/11/20 Python
sublime python3 输入换行不结束的方法
2018/04/19 Python
windows上安装python3教程以及环境变量配置详解
2019/07/18 Python
简单了解python 邮件模块的使用方法
2019/07/24 Python
pytorch 固定部分参数训练的方法
2019/08/17 Python
法国票务网站:Ticketmaster法国
2018/07/09 全球购物
澳大利亚在线家具店:Luxo Living
2019/03/24 全球购物
销售主管岗位职责范本
2014/02/14 职场文书
同学聚会主持词
2014/03/18 职场文书
五年级上册复习计划
2015/01/19 职场文书
建国大业观后感600字
2015/06/01 职场文书
师德师风心得体会(2016精选篇)
2016/01/12 职场文书
品德与社会教学反思
2016/02/24 职场文书
2016年119消防宣传日活动总结
2016/04/05 职场文书
python plt.plot bar 如何设置绘图尺寸大小
2021/06/01 Python