C# 如何淡出HtmlHelper在页面加载时呈现的用户通知?
我正在使用C# 如何淡出HtmlHelper在页面加载时呈现的用户通知?,c#,jquery,asp.net-mvc,html-helper,C#,Jquery,Asp.net Mvc,Html Helper,我正在使用HtmlHelper向用户显示更新,如下所示: public static class NotificationHelper { public static string PasswordNotification(this HtmlHelper html) { //Other code... return String.Format("<div class='{0}'></label>
HtmlHelper
向用户显示更新,如下所示:
public static class NotificationHelper
{
public static string PasswordNotification(this HtmlHelper html)
{
//Other code...
return String.Format("<div class='{0}'></label><img src=/Images/SuccessTick.png class='{1}'alt=success>Your password has been succesfully saved</div>", "feedback-complete", "notification-icon");
在网页中:
<%=Html.CourseUpdateNotification() %>
此时,对用户的通知将保留在屏幕上,直到用户离开页面或刷新页面(如预期的那样)
我想要达到的效果是显示通知,但在3秒钟后将其淡出
我试图通过以下jQuery实现这一点:
(注意,HtmlHelper
使用TagBuilder
创建一个div
,并带有class属性反馈完成
)
不幸的是,这对我不起作用,我也不知道为什么。我尝试了一些变体,包括$(window.load
)等,但没有效果
关于HtmlHelper以及如何在页面加载后访问它,我是否遗漏了一些更基本的内容
洞察总是值得赞赏的。尝试取出额外的
$(function(){
行
例如
HTHs,查尔斯 编辑:好的,如果不起作用,试试这个
setTimeout(function() { jQuery('div.feedback-complete').fadeOut(); }, 3000);
如果这不起作用,那么你需要找出问题出在哪里。我建议你把它剥离到最基本的部分,然后从那里开始
因此,请先尝试一下:
setTimeout("alert('I am displayed after 3 seconds!')", 3000);
如果效果如预期,请尝试以下操作:
setTimeout(function () { alert('I am displayed after 3 seconds!'); }, 3000);
或者这个:
setTimeout("jQuery('div.feedback-complete').fadeOut()", 3000);
Etc Etc尝试取出额外的
$(function(){
行
例如
HTHs,查尔斯 编辑:好的,如果不起作用,试试这个
setTimeout(function() { jQuery('div.feedback-complete').fadeOut(); }, 3000);
如果这不起作用,那么你需要找出问题出在哪里。我建议你把它剥离到最基本的部分,然后从那里开始
因此,请先尝试一下:
setTimeout("alert('I am displayed after 3 seconds!')", 3000);
如果效果如预期,请尝试以下操作:
setTimeout(function () { alert('I am displayed after 3 seconds!'); }, 3000);
或者这个:
setTimeout("jQuery('div.feedback-complete').fadeOut()", 3000);
Etc Etc作为替代,如果您使用的是jQuery 1.4,则可以使用新方法 我自己一点也没试过,但我想也许可以做这样的事情
$(document).ready(function() {
$('div.feedback-complete').delay(3000).fadeOut();
});
HTHs,Charles作为替代,如果您使用的是jQuery 1.4,则可以使用新方法 我自己一点也没试过,但我想也许可以做这样的事情
$(document).ready(function() {
$('div.feedback-complete').delay(3000).fadeOut();
});
HTHs,Charles经过一些研究,我认为问题在于我的
HtmlHelper
返回字符串的格式
最初,我在HtmlHelper
中有这样的内容:
public static class NotificationHelper
{
public static string PasswordNotification(this HtmlHelper html)
{
//Other code...
return "<div class=feedback-complete><img src=/Images/SuccessTick.png class=notification-icon alt=success>Your password has been succesfully saved</div>";
然后,它呈现了在类名周围有“
的Html
<div class='feedback-complete'><img src=/Images/SuccessTick.png class=notification-icon alt=success>Your password has been succesfully saved</div>
最后,我发现有趣的是,类名周围缺少撇号并没有阻止CSS正确呈现Html一开始,假设html片段在没有撇号的情况下正确呈现这一事实意味着这不可能是为什么jQuery淡出效应对我不起作用的问题…经过一些研究,我认为问题在于如何格式化我的
HtmlHelper
返回字符串
最初,我在HtmlHelper
中有这样的内容:
public static class NotificationHelper
{
public static string PasswordNotification(this HtmlHelper html)
{
//Other code...
return "<div class=feedback-complete><img src=/Images/SuccessTick.png class=notification-icon alt=success>Your password has been succesfully saved</div>";
然后,它呈现了在类名周围有“
的Html
<div class='feedback-complete'><img src=/Images/SuccessTick.png class=notification-icon alt=success>Your password has been succesfully saved</div>
最后,我发现有趣的是,类名周围缺少撇号并没有阻止CSS正确呈现Html从一开始,假设html片段在没有撇号的情况下正确呈现这一事实意味着这不可能是为什么jQuery淡出效果对我不起作用的问题…感谢您的回复-我尝试了您的建议,但它没有产生我想要达到的效果。我会继续研究,如果我获取解决方案我将发布它…刚刚看到您的编辑。我将尝试一下(包括下面的.delay()建议)…查看我接受的答案。你的jQuery代码很好。问题出在我的HtmlHelper字符串的格式上。感谢你的回复-我尝试了你的建议,但没有达到我想要的效果。我会继续研究,如果我得到解决方案,我会发布它…刚刚看到你的编辑。我会尝试一下(包括下面的.delay()建议)…查看我接受的答案。你的jQuery代码很好。问题出在我的HtmlHelper字符串的格式上。很高兴听到你解决了问题。只是阅读你的答案,“下面的jQuery”看起来格式不好…很高兴听到你解决了问题。只是阅读你的答案,“下面的jQuery”看起来格式不好。。。