Django下实现:

urls.py:

from django.conf.urls import url
from django.contrib import admin
from app01 import views urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^index/', views.index),
url(r'^pop/', views.pop),
]

  

app01.views.py

from django.shortcuts import render

def index(request):
return render(request,'index.html') def pop(request):
if request.method == "GET":
return render(request, 'pop.html')
else:
user = request.POST.get('user') #这里可以有数据库操作
return render(request,'pop_response.html',{'user':user})

  

templates.index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1 id="i1">无所谓</h1>
<a href="#" onclick="popUp('http://www.oldboyedu.com')">点我点我</a> <script>
function xxxpopupCallback(text) {
document.getElementById('i1').innerHTML = text;
}
function popUp(url) {
window.open( '/pop/', '/pop/' ,"status=1, height:500, width:600, toolbar=0, resizeable=0");
} </script>
</body>
</html>

  

templates.pop.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form method="post">
{% csrf_token %}
<input type="text" name="user">
<input type="submit" value="保存">
</form>
</body>
</html>

  

templates.pop_response.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>正在关闭</h1>
<script>
(function () {
// 可以调用popup原页面的一个函数
opener.xxxpopupCallback("{{ user }}");
window.close();
})() </script>
</body>
</html>

  

popup demo的更多相关文章

  1. Javascript快速入门(下篇)

    Javascript, cheer up. Ajax:其通过在Web页面与服务器之间建立一个额外的处理层,这个处理层就被称为Ajax引擎,它解释来自用户的请求,在后台以异步的方式处理服务器通信,其结构 ...

  2. 40个新鲜的 jQuery 插件,使您的网站用户友好

    作为最流行的 JavaScript 开发框架,jQuery 在现在的 Web 开发项目中扮演着重要角色,它简化了 HTML 文档遍历,事件处理,动画以及 Ajax 交互,这篇文章特别收集了40个新鲜的 ...

  3. Zybo GPIO Demo Run Embedded Linux

    1.Environment Ubuntu 12.04 x86_64 Vivado 2013.4 SDK 2013.4   2.Pre-requisites 2.1 CodeSourcery arm-g ...

  4. 课时9—popup

    内容比较多的时候可以全屏显示,用第一种实现方式,如图1 图1 内容较少的话可以使用第二种实现方式如图2:图2 具体的实现代码如下: .header,.footer,.wrap-page{ positi ...

  5. AngularJs的UI组件ui-Bootstrap分享(四)——Datepicker Popup

    Datepicker Popup是用来选择日期的控件,一般和文本框一起使用,功能和Jquery的插件My97DatePicker一样.在Datepicker Popup内部使用了ui-bootstra ...

  6. 重新想象 Windows 8.1 Store Apps (78) - 控件增强: ScrollViewer, FlipView, Popup

    [源码下载] 重新想象 Windows 8.1 Store Apps (78) - 控件增强: ScrollViewer, FlipView, Popup 作者:webabcd 介绍重新想象 Wind ...

  7. [转]jQuery Popup Login and Contact Form

    本文转自:http://www.formget.com/jquery-popup-form/ Pop up forms are the smart way to present your site. ...

  8. Pass value from child popup window to parent page window using JavaScript--reference

    Here Mudassar Ahmed Khan has explained how to pass value from child popup window to parent page wind ...

  9. jquerymobile知识点三:弹出层popup

    弹出层popup很简单,主要就是弹出验证,登陆注册,提交信息之类的,下面是我写好的一个demo... <div data-role="popup" id="popu ...

随机推荐

  1. flutter 监听返回

    在项目中遇到了一个场景,A页面必须返回某个tab页,但是A页面可能会调到B,再跳到C,最后回到A.这个时候A的返回肯定是C. 想了一些解决方案,都不如监听A页面的实体键返回或者虚拟键返回来的快速便捷. ...

  2. shell编程题(四)

    编译当前目录下的所有.c文件 #!/bin/bash ] ;] 输入参数个数 echo "Please follow up file.c!" echo "eg: ./ma ...

  3. SSM + ehcache 异常

    异常如下: 十二月 26, 2017 1:24:44 下午 org.apache.jasper.servlet.TldScanner scanJars 信息: At least one JAR was ...

  4. Mybatis mapper接口与xml文件路径分离

    为什么分离 对于Maven项目,IntelliJ IDEA默认是不处理src/main/java中的非java文件的,不专门在pom.xml中配置<resources>是会报错的,参考这里 ...

  5. ZR#1012

    ## ZR#1012 blog咕咕咕了好久,开始补. 解法: 一个很显然的性质, $ x $ 只能转移到 $ x+1 $ 或者 $ 2x $ 处,所以我们可以以此性质建图,即 $ x $ 向 $ x ...

  6. python实用技巧之任务切分

    Python 大任务切分小任务 今天来说说,Python中的任务切分.以爬虫为例,从一个存 url 的 txt 文件中,读取其内容,我们会获取一个 url 列表.我们把这一个 url 列表称为大任务. ...

  7. URLEncoder.encode 使用心得

    1.解决接口GET请求中:参数包含中文问题? 通过URLEncoder.encode 可以解决.我此次使用的utf-8编码,所以对中文进行urlencode  编码 而在服务器短 使用的tomcat ...

  8. NPAPI插件开发详细记录:用VS2010开发NPAPI插件步骤<转>

    原帖地址:https://blog.csdn.net/z6482/article/details/7660748 ------------------------------------------- ...

  9. 阿里云ECS服务器环境搭建(1) —— ubuntu 16.04 图形界面的安装

    阿里云ECS服务器环境搭建(1) —— ubuntu 16.04 图形界面的安装1. 背景在我们购买阿里云ECS服务器之后,默认的系统环境是很干净的,我购买的是ubuntu16.04,远程登录进入之后 ...

  10. 阿里物联网平台(一)Windows系统+VS2017 模拟设备端接入

    https://blog.csdn.net/panwen1111/article/details/88365636 一.阿里物联网平台 平台地址:https://account.aliyun.com ...