بعد از اینکه فرم رو طراحی کردیم (تکه ای از کد مربوط به فرم ) :

<asp:Label ID="Label1" runat="server" Text="نام کاربری : "></asp:Label>

<asp:TextBox ID="txtUserName" runat="server" ValidationGroup="ac" Width="175px"></asp:TextBox>

<asp:Label ID="Label2" runat="server" Text="کلمه عبور : "></asp:Label>

<asp:TextBox ID="txtPassWord" runat="server" TextMode="Password" ValidationGroup="ac"

                    Width="175px"></asp:TextBox>

 شروع می‌کنیم به نوشتن دستورات جی‌کوئری .  باید از دو متد focus  و  blur جی‌کوئری برای فهمیدن اینکه چه وقتی کاربر وارد فیلد شده و چه وقتی از اون خارج شده استفاده کنیم. برای تغییر ویژگی های فیلد هم باید از متد css  جی‌کوئری استفاده کنیم.

<script type="text/javascript" language="javascript">

      $("#txtUserName").focus(

            function() { $("#txtUserName").css("border-color", "#5bb53e")}

              )

      $("#txtUserName").blur(

            function() { $("#txtUserName").css("border-color", "#000000") }

            )

</script>

به شکل زیر توجه کنید:

دقت کنید که به جای border-color می‌تونید از attribute های دیگه ای که تو سی‌اس‌اس هست استفاده کنید

مثلا من تو مثال از background-color هم استفاده کردم.

 موفق باشید.

دریافت پروژه مثال