效果:在p1.html页面点击,弹出p2的弹出框,填写数据,在 popup_response页面处理数据
1、url设置
urlpatterns = patterns( url(r'^p1.html',views.p1), url(r'^p2.html', views.p2), )
2、视图函数:views.py
from django.shortcuts import render def p1(request): return render(request,"p1.html") def p2(request): if request.method == "GET": return render(request,"p2.html") elif request.method == "POST": city =request.POST.get("city") print(city) return render(request,"popup_response.html",{"city":city})
3、前端页面及函数
p1.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>P1页面</h1> <select name="" id="i1"> <option value="">上海</option> <option value="">北京</option> </select> <input type="button" onclick="popupfunc()" value="点击弹出添加弹出框"> <script> function popupfunc() { window.open("/p2.html","popup_page","status=1,height:500,600,toolbar=0,resizeable=0") } {# alert("接收p2弹出框数据:"+data)#} function p1_receive_func(data) { var op = document.createElement("option"); op.innerHTML = data; op.setAttribute("selected","selected"); document.getElementById("i1").appendChild(op); } </script> </body> </html>
p2.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>这是P2页面</h1> <form method="post"> {% csrf_token %} <input type="text" name="city"> <input type="submit" value="提交"> </form> </body> </html>
popup_response.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>正在返回</title> </head> <body> <script> (function () { var name ="{{ city }}"; window.opener.p1_receive_func(name); window.close(); })() </script> </body> </html>