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字符串拼接的几种方法整理
Aug 02 Python
python实现随机梯度下降法
Mar 24 Python
Python的argparse库使用详解
Oct 09 Python
windows下搭建python scrapy爬虫框架步骤
Dec 23 Python
Django框架教程之中间件MiddleWare浅析
Dec 29 Python
Python callable内置函数原理解析
Mar 05 Python
python为Django项目上的每个应用程序创建不同的自定义404页面(最佳答案)
Mar 09 Python
在Mac中PyCharm配置python Anaconda环境过程图解
Mar 11 Python
jupyter notebook 写代码自动补全的实现
Nov 02 Python
pytorch简介
Nov 11 Python
Python中Schedule模块使用详解 周期任务神器
Apr 19 Python
Python写情书? 10行代码展示如何把情书写在她的照片里
Apr 21 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
IIS下配置Php+Mysql+zend的图文教程
2006/12/08 PHP
在php MYSQL中插入当前时间
2008/04/06 PHP
坏狼php学习 计数器实例代码
2008/06/15 PHP
php使用ob_start()实现图片存入变量的方法
2014/11/14 PHP
PHP框架自动加载类文件原理详解
2017/06/06 PHP
php利用云片网实现短信验证码功能的示例代码
2017/11/18 PHP
php抽象类和接口知识点整理总结
2019/08/02 PHP
asp.net和php的区别点总结
2019/10/10 PHP
laravel框架创建授权策略实例分析
2019/11/22 PHP
JQuery的Ajax跨域请求原理概述及实例
2013/04/26 Javascript
js省市县三级联动效果实例
2020/04/15 Javascript
详解Angular的数据显示优化处理
2016/12/26 Javascript
JavaScript常用正则验证函数实例小结【年龄,数字,Email,手机,URL,日期等】
2017/01/23 Javascript
vue微信分享出来的链接点开是首页问题的解决方法
2018/11/28 Javascript
vue实现抖音时间转盘
2019/09/08 Javascript
Vue el-autocomplete远程搜索下拉框并实现自动填充功能(推荐)
2019/10/25 Javascript
Python代码解决RenderView窗口not found问题
2016/08/28 Python
详解PyTorch批训练及优化器比较
2018/04/28 Python
Django框架实现分页显示内容的方法详解
2019/05/10 Python
Python3 实现文件批量重命名示例代码
2019/06/03 Python
python实现微信自动回复机器人功能
2019/07/11 Python
python 实现保存最新的三份文件,其余的都删掉
2019/12/22 Python
基于python tkinter的点名小程序功能的实例代码
2020/08/22 Python
css3+jq创作含苞待放的荷花
2014/02/20 HTML / CSS
Fashion Eyewear美国:英国线上设计师眼镜和太阳镜的零售商
2016/08/15 全球购物
服装销售人员求职自我评价
2013/09/26 职场文书
专业销售业务员求职信
2013/11/18 职场文书
幼儿园小班评语大全
2014/04/17 职场文书
最常使用的求职信
2014/05/25 职场文书
七一讲话心得体会
2014/09/05 职场文书
党的群众路线教育实践活动剖析材料
2014/09/30 职场文书
2015秋学期开学寄语
2015/05/28 职场文书
开票证明
2015/06/23 职场文书
导游词之阳朔遇龙河
2019/12/16 职场文书
详解RedisTemplate下Redis分布式锁引发的系列问题
2021/04/27 Redis
Oracle以逗号分隔的字符串拆分为多行数据实例详解
2021/07/16 Oracle