如何在弹出窗口和调用弹出窗口的页面之间传输数据? 我想在zurb基金会的popup“reveal”中为用户注册做一个ajax表单。 你认为可能吗?
答案 0 :(得分:6)
这个答案可能有点迟了,但你绝对可以将一个表单放入显示弹出窗口。例如,如果您希望在单击登录按钮时显示登录对话框:
在HTML的底部(在所有行之后),为弹出窗口创建内容:
<div id="login-modal" class="reveal-modal" style="width: 400px; background: black; color: white;">
<h2>Login</h2>
<form id="login-form" class="six">
<div class="row">
<label for="username">Username</label>
<input type="text" name="username" />
<label for="password">Password</label>
<input type="password" name="password" />
</div>
<div class="row">
<div class="right" style="margin-top: 20px;">
<button type="reset" class="button radius alert">Reset</button>
<button type="submit" class="button radius">Login</button>
</div>
</div>
</form>
<a class="close-reveal-modal">×</a>
</div>
然后您可以使用他们的一种方法显示它。新的基础3.0让你可以非常轻松地显示它:
<a href="#"
data-reveal-id="login-modal"
data-animation="fadeAndPop"
data-animationspeed="300"
data-closeonbackgroundclick="true"
data-dismissmodalclass="close-reveal-modal">Login</a>
希望有所帮助!
答案 1 :(得分:1)
在app.js中尝试此操作 然后在任何锚点上使用reveal class
$('a.reveal').click(function(event) {
event.preventDefault();
var $div = $('<div>').addClass('reveal-modal').appendTo('body'),
$this = $(this);
$div.empty().html('<p align="center"><img src="application/public/loading.gif" /></p>').append('<a class="close-reveal-modal">×</a>').reveal();
$.get($this.attr('href'), function(data) {
return $div.empty().html(data).append('<a class="close-reveal-modal">×</a>').reveal();
});
});