我有:
@using (Ajax.BeginForm("actionToDo", new AjaxOptions
{
HttpMethod = "post",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "updatediv",
OnBegin = "$('#updatediv').fadeOut()",
OnComplete = "$('#updatediv').hide().fadeIn()"
}))
{
<div id='updatediv'>
</div>
}
淡入正常,但问题是当我提交Ajax请求时它不会淡出。它只是消失,然后在新内容中淡出。在使用简单警报进行测试后,似乎“OnBegin”直到旧内容被删除之后才发生,这与文档相矛盾:“获取或设置要调用的 javascript 函数的名称在页面更新之前。”
知道为什么会这样吗?
最佳答案
好的,问题是当你调用 fadeout 时,为时已晚。表单提交已经发生,这意味着 div 已经消失(由于替换方法的性质)。请记住,这些事件的触发速度非常快。您需要做的是在提交表单之前强制淡出。对此有多种解决方案(许多已经在堆栈溢出,包括使用 e.preventDefault)但我更喜欢只隐藏真正的提交按钮,添加一个假的并使用它来淡出,然后通过使用触发延迟的表单提交一个设置超时。我还添加了一个外部 div,以在替换的 div 消失时保持固定的屏幕高度。
@using (Ajax.BeginForm("actionToDo", new AjaxOptions
{
HttpMethod = "post",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "updatediv",
OnComplete = "$('#updatediv').hide().fadeIn()"
}))
{
<div style="height:20px;">
<div id='updatediv'>
text to replace</div>
</div>
<input id='realsubmit' style='display:none;' type="submit" />
<input id='fakesubmit' type="button" value="submit" onclick ="$('#updatediv').fadeOut('slow'); setTimeout(function () { $('#realsubmit').click(); }, 1000);" />
}
关于javascript - Ajax.BeginForm 淡出不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17270494/