我怎样才能使用jQuery使验证图标慢慢显示出来,渐渐消失

时间:2010-01-23 11:44:55

标签: asp.net jquery fade

这是我到目前为止所做的事情,但事情并没有真正发挥作用。 (我将jQuery.js文件从解决方案资源管理器拖到我的html区域。

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="SignUpFormTest._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.4.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            //fade in the context of whatever is inside the div tag.
            $('#name').fadeIn("slow");
        });
    </script>
</head>

<body bgcolor="#FFFFFF">

<p>
Note that this form doesn't actually do anything
except illustrate the Required Field Validator.
</p>

<form id="frmValidator" action="required.aspx" method="post" runat="server">

    Enter Your Name:
    <asp:TextBox id="txtName" runat="server" />
    <div id="name"><asp:RequiredFieldValidator id="valTxtName" ControlToValidate="txtName" ErrorMessage='<img src="../Images/no.png">' runat="server" /></div>

    <br />
    <asp:button id="btnSubmit" text="Submit" runat="server" />

</form>
<p>
Hint: Try submitting it before you enter something.
</p>
</body>


</html>
  

验证图标时会弹出。

没有淡入或任何东西。另外,我知道我目前的解决方案是hacky,所以我真的希望有人告诉我应该做什么而不是为了一个动画而创建一个DIV标签。

2 个答案:

答案 0 :(得分:0)

 $(document).ready(function() { 
document.getElementById('valTxtName').onpropertychange = function(){
            $('#name').fadeIn("slow"); 
}

}); 

答案 1 :(得分:0)

确保对JQuery的引用有效并使用以下代码:

$(document).ready(function() {
    $('#name').hide().fadeIn("slow");
});

如果我没有弄错,因为div在您的情况下已经可见,jQuery不会淡入。hide()方法确保div最初不可见,然后缓慢淡入。