popup demo
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的更多相关文章
- Javascript快速入门(下篇)
Javascript, cheer up. Ajax:其通过在Web页面与服务器之间建立一个额外的处理层,这个处理层就被称为Ajax引擎,它解释来自用户的请求,在后台以异步的方式处理服务器通信,其结构 ...
- 40个新鲜的 jQuery 插件,使您的网站用户友好
作为最流行的 JavaScript 开发框架,jQuery 在现在的 Web 开发项目中扮演着重要角色,它简化了 HTML 文档遍历,事件处理,动画以及 Ajax 交互,这篇文章特别收集了40个新鲜的 ...
- 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 ...
- 课时9—popup
内容比较多的时候可以全屏显示,用第一种实现方式,如图1 图1 内容较少的话可以使用第二种实现方式如图2:图2 具体的实现代码如下: .header,.footer,.wrap-page{ positi ...
- AngularJs的UI组件ui-Bootstrap分享(四)——Datepicker Popup
Datepicker Popup是用来选择日期的控件,一般和文本框一起使用,功能和Jquery的插件My97DatePicker一样.在Datepicker Popup内部使用了ui-bootstra ...
- 重新想象 Windows 8.1 Store Apps (78) - 控件增强: ScrollViewer, FlipView, Popup
[源码下载] 重新想象 Windows 8.1 Store Apps (78) - 控件增强: ScrollViewer, FlipView, Popup 作者:webabcd 介绍重新想象 Wind ...
- [转]jQuery Popup Login and Contact Form
本文转自:http://www.formget.com/jquery-popup-form/ Pop up forms are the smart way to present your site. ...
- 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 ...
- jquerymobile知识点三:弹出层popup
弹出层popup很简单,主要就是弹出验证,登陆注册,提交信息之类的,下面是我写好的一个demo... <div data-role="popup" id="popu ...
随机推荐
- PHP 高手博客网站集合
风雪之隅-Laruence的博客 韩天峰(Rango)的博客 我的志愿是做一个校长 张宴的博客 - Web系统架构与底层研发 沈逸的个人站点 博学无忧 - 信海龙的博客
- poj 3735 稀疏矩阵矩阵快速幂
设人数为 $n$,构造 $(n + 1) \times (n + 1)$ 的矩阵 得花生:将改行的最后一列元素 $+ 1$ \begin{gather}\begin{bmatrix}1 & 0 ...
- 洛谷 P2872 [USACO07DEC]道路建设Building Roads 题解
P2872 [USACO07DEC]道路建设Building Roads 题目描述 Farmer John had just acquired several new farms! He wants ...
- 在linux中设置优先使用ipv4,而不是ipv6
背景: 有时候更新源的时候默认使用ipv6,而ipv6下载数据时候总出现问题. 所有想默认出口的时候优先使用ipv4出口访问,而不是ipv6. 要使用ipv4 连接优先而不必禁用ipv6,需要修改ga ...
- 基于腾讯云监控 API 的 Grafana App 插件开发
Tencent Cloud Monitor App Grafana 是一个开源的时序性统计和监控平台,支持例如 elasticsearch.graphite.influxdb 等众多的数据源,并以功能 ...
- [WC2010]重建计划(长链剖分版)
传送门 Description Solution 时隔多年,补上了这题的长链剖分写法 感觉比点分治要好写的多 我们假设\(pos\)是当前点的\(dfn\),它距离所在链的底端的边的数量是\(len\ ...
- 在Typora中使用Latex
https://blog.csdn.net/happyday_d/article/details/83715440 今后可能更多在本地编辑出Markdown之后复制上博客或者上传到GitHub.
- QML学习笔记
1.一个 QML 文档有且只有一个根元素. 2.QML 元素名后所有内容使用 {} 包围起来.{} 之中是该元素的属性:属性以键值对 name : value 的形式给出. 3.QML 元素可以有一个 ...
- 开源GIT仓库-----gitlab
简介:GitLab是一个利用 Ruby on Rails 开发的开源应用程序,实现一个自托管的Git项目仓库,可通过Web界面进行访问公开的或者私人项目.它拥有与Github类似的功能,能够浏览源代码 ...
- flutter PopupMenuButton弹出式菜单列表
import 'package:flutter/material.dart'; class PopupMenuButtonDemo extends StatefulWidget { @override ...