popup方法:

一、创建一个页面

1.创建url和视图函数::

  1. from django.shortcuts import render
  2. def p1(request):
  3. return render(request,'p1.html')
  4. urlpatterns = [
  5. url(r'^nb/', v1.site.urls),
  6. url(r'^p1/', p1)]

2.创建HTML:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <h1>P1页面</h1>
  9. <input type="button" value="按钮" onclick="popupFunc();" />
  10. <script>
  11. function popupFunc(){
  12. window.open('http://www.baidu.com', 'asdfadf',"status=1, height:200, width:200, toolbar=0, resizeable=0")
  13. }
  14. </script>
  15. </body>
  16. </html>

上述代码中:

  • asdfadf是命名;

  • status=1, height:200, width:200, toolbar=0, resizeable=0"是弹窗的窗口参数

执行效果如下图所示:

二、需求

根据上述的需求这里代码需要做相应的修改:

1.url和视图函数:

  1. from django.shortcuts import render
  2. def p1(request):
  3. return render(request,'p1.html')
  4. def p2(request):
  5. if request.method == "GET":
  6. return render(request,'p2.html')
  7. elif request.method == "POST":
  8. from app01 import models
  9. obj = models.UserGroup.objects.create(title=request.POST.get('city'))
  10. return render(request,'popup_response.html',{'obj':obj})
  11. urlpatterns = [
  12. url(r'^nb/', v1.site.urls),
  13. url(r'^p1/', p1),
  14. url(r'^p2/', p2)]

2.Html页面:

p2的HTML页面:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <h1>P2</h1>
  9. <form method="post">
  10. {% csrf_token %}
  11. <input type="text" name="city">
  12. <input type="submit" value="提交">
  13. </form>
  14. </body>
  15. </html>

p1页面的HTML页面:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <h1>P1页面</h1>
  9. <select id="i1">
  10. <option>上海</option>
  11. <option>北京</option>
  12. </select>
  13. <input type="button" value="添加" onclick="popupFunc();" />
  14. <script>
  15. function popupFunc(){
  16. window.open('/p2/', 'asdfadf',"status=1, height:200, width:200, toolbar=0, resizeable=0")
  17. }
  18. function fooo(name){
  19. var op = document.createElement('option');
  20. op.innerHTML = name;
  21. op.setAttribute('selected','selected');
  22. document.getElementById('i1').appendChild(op);
  23. }
  24. </script>
  25. </body>
  26. </html>

popup_response的HTML页面:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>正在传输</title>
  6. </head>
  7. <body>
  8. <script>
  9. (function() {
  10. var name = "{{ obj.title }}" ;
  11. window.opener.fooo(name);
  12. window.close();
  13. })()
  14. </script>
  15. </body>
  16. </html>

执行效果如下图:

下面是整个代码的执行过程的图示:

popup方法的更多相关文章

  1. WDA基础十五:POPUP WINDOW

    1.组件控制器定义属性: 2.实现popup方法: METHOD stock_popup . DATA: l_cmp_api TYPE REF TO if_wd_component, l_window ...

  2. Wscript的popup

    Dim WSHShell Set WSHShell = WScript.CreateObject("WScript.Shell") WshSHell.popup "枚举主 ...

  3. Leaflet:Event与Layer类属性、方法

    Event 之所以要说Event,是因为很多类都是继承自Layer--Marker.Popup.Tooltip.Path以及继承自Path的Circle.Polyline.Polygon...:而La ...

  4. VBScript: Windows脚本宿主介绍

    Windows脚本宿主(Windows Script Host, WSH)是一个Windows管理工具.WSH创建了一个脚本运行的主环境,WSH使脚本能够使用对象和服务,并提供脚本执行的准则.WSH还 ...

  5. JavaScrtip之JS最佳实践

    一.JavaScript之平稳退化 这边使用一个当用户点击某个页面内某个链接弹出一个新窗口的案例: JavaScript使用window对象的open()方法来创建新的浏览器窗口; window.op ...

  6. 地址四级联动的vue组件

    一.效果图如下: 二.思路 主要在vue中结合 mint-ui组件的Picker和Popup方法,负责对json地址进行展示: 三.代码地址 四.说明 address4.json最好是在点击父组件的地 ...

  7. Java应用程序使用系统托盘资源

    要想使自己开发的Java SE项目运行在自己的电脑系统托盘上,这并不是什么难事,总共需要如下几步即可: 1.线判断一下,系统托盘是否可用,否则接下来的程序将不可避免的报出异常咯 2.获得一个Syste ...

  8. 【Unity编辑器】UnityEditor多重弹出窗体与编辑器窗口层级管理

    一.简介 最近马三为公司开发了一款触发器编辑器,对于这个编辑器策划所要求的质量很高,是模仿暴雪的那个触发器编辑器来做的,而且之后这款编辑器要作为公司内部的一个通用工具链使用.其实,在这款触发器编辑器之 ...

  9. Leaflet API翻译

    转自: http://jsrookie.iteye.com/blog/2318972(上) http://jsrookie.iteye.com/blog/2318973(下) L.Map API各种类 ...

随机推荐

  1. 201521123020 《Java程序设计》第3周学习总结

    本周学习总结 初学面向对象,会学习到很多碎片化的概念与知识.尝试学会使用思维导图将这些碎片化的概念.知识组织起来.请使用纸笔或者下面的工具画出本周学习到的知识点.截图或者拍照上传. 书面作业 1.代码 ...

  2. 201521123035《Java程序设计》第十四周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多数据库相关内容. 2. 书面作业 1. MySQL数据库基本操作 建立数据库,将自己的姓名.学号作为一条记录插入.(截图,需出现自 ...

  3. 201521123012 《Java程序设计》第十四周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多数据库相关内容. 2. 书面作业 1. MySQL数据库基本操作 1.1建立数据库,将自己的姓名.学号作为一条记录插入.(截图, ...

  4. 201521123090《Java程序设计》第12周学习总结

    本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 书面作业 将Student对象(属性:int id, String name,int age,double grad ...

  5. LINUX - awk命令之NF和$NF区别 (转)

    NF和$NF 区别问答:(转)1.awk中$NF是什么意思?#pwd/usr/local/etc~# echo $PWD | awk -F/ '{print $NF}'etcNF代表:浏览记录的域的个 ...

  6. Spring - bean的lazy-init属性(懒加载)

    默认情况下,容器初始化的时候便会把bean实例化,通常这样做可以让一些配置或者bean实例化的异常在容器启动的时候就发现,而不是在N久之后.但有时候,我们希望某个可能不会用到但又不是100%不用的be ...

  7. 小甲鱼:Python学习笔记002_数组_元组_字符串

    创建普通数组 >>> member=["山东黄金","九阳股份"] >>> member ['山东黄金', '九阳股份'] ...

  8. Jacoco远程统计tomcat服务(Windows系统)的代码覆盖率

    Jacoco远程统计tomcat服务(Windows系统)的代码覆盖率 2017-09-21 目录 1 Jacoco的安装和设置  1.1 什么是Jacoco?  1.2 Jacoco安装  1.3 ...

  9. Routing in ASP.NET Core

    .NET-Core Series Server in ASP.NET-Core DI in ASP.NET-Core Routing in ASP.NET-Core Error Handling in ...

  10. scoke摘要

      登录|注册     关闭 永不磨灭的意志 /* ----------------500G的电影拷到了U盘上,U盘的重量会不会增加?----------------------*/       目录 ...