0
我正在制作一个与jQuery ajax.form插件一起提交的下拉式登录表单。效果起作用，提交工作。但是，当你把它们放在一起，他们不工作...jQuery表单提交/效果改进？
这是为表达式引擎，所以{if}标签只是EE条件。看到用户登录后内容发生了变化 - 我只是需要重新加载，以便内容发生变化 - 我认为做一堆.html（）重写会更容易... 表单已提交，正确的内容将重新加载并且可点击，但“#panel”不会重新生成动画。
<div id="client-login">
<div class="wrap">
<p class="work-message">We're doing some work under the hood! If things get/are funky, please excuse us!</p>
{if logged_out}
<div id="client" class="login">Client Login</div>
{/if}
{if logged_in}
<div id="client" class="login">Hey, {username}!</div>
{/if}
</div>
</div>
<div id="panel">
<div id="panel-content" class="wrap">
{if logged_out}
{exp:member:login_form id="login-form"}
<ul>
<li>
<label><span>Username</span></label>
<input type="text" name="username" value="" maxlength="32" class="input" size="25" />
</li>
<li>
<label><span>Password</span></label>
<input type="password" name="password" value="" maxlength="32" class="input" size="25" />
</li>
<li class="login-forgot">
<a href="{path='member/forgot_password'}">Forgot your password?</a>
</li>
{if auto_login}
<li class="checkbox">
<input class='checkbox' type='checkbox' name='auto_login' value='1' /> Auto-login on future visits
</li>
{/if}
</ul>
<p>
<input type="submit" id="panelsubmit" name="submit" value="Submit" />
</p>
{/exp:member:login_form}
{/if}
<div id="messages">
<p></p>
</div>
{if logged_in}
<div id="logout">
<h2>What do ya wanna' do?!</h2>
<form id="login-form" >
<input type="hidden" name="ACT" value="10" />
<input type="submit" value="Log Out" />
</form>
</div>
{/if}
$(document).ready(function()
{
$('.login').toggle(
function()
{
$('#panel').stop().animate({
height: "150",
padding:"20px 0",
backgroundColor:'rgba(0,0,0,0.8)',
}, 500);
$('#client-login').stop().animate({
backgroundColor:'rgba(0,0,0,0.8)',
}, 500);
},
function()
{
$('#panel').stop().animate({
backgroundColor:'rgba(0,0,0,0.2)',
height: "0",
padding:"0px 0",
}, 500);
$('#client-login').stop().animate({
backgroundColor:'rgba(0,0,0,0.2)',
}, 500);
});
$('#login-form').ajaxForm({
// success identifies the function to invoke when the server response
// has been received; here we apply a fade-in effect to the new content
success: function() {
$("#client").remove().fadeOut("fast");
$("#client-login").load("/ #client-login").fadeIn("fast");
$("#panel-content").remove().fadeOut("fast");
$("#panel").load("/ #panel-content").fadeIn("fast");
}
});
});
功能基本上是存在的，但是表单需要与之前一样提交后才能工作！另外，.remove的动画不起作用。我是JavaScript新手，我不知道如何改进。
我不确定我的语法是否正确。这很有用，但我必须点击它两次才能初始化......我不知道该怎么做！请原谅我的无知！ – 2009-06-01 01:17:59
你能发表你的语法吗？ – 2009-06-01 01:40:56