.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
 
Sign In
Register
 
Win Surprise Gifts!!!
Congratulations!!!


Top 5 Contributors of the Month
david stephan

Home >> Code Snippets >> Visual Studio >> Post New Resource Bookmark and Share   

 Subscribe to Code Snippets

All in Jquery (hot hot hot)

Posted By:Do Quoc Hung       Posted Date: January 28, 2011    Points: 75    Category: Visual Studio    URL: http://www.dotnetspark.com  

how to change inteface website use Jquery
 

Event
Ready

<head runat="server">

    <title>title>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js">script>

    <script type="text/javascript">

        $(document).ready(function () {

            $("p").text("Hello Do Quoc Hung");

        });

     script>

head>

<body>

<p style="font-size:20px; color:Yellow">p>

body>

html>


Change

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

    <title>title>

    <script src="jquery-1.4.1-vsdoc.js" type="text/javascript">script>

    <script src="jquery-1.4.1.js" type="text/javascript">script>   

head>

<body>

    <form id="form1" runat="server">

    <div title="DivA">

    <div title="DivB">       

        <p>Welcomep>

    div>

    div>   

    <select id="Select1" title="SelectNumer">

    <option value="1" selected="selected">1option>

    <option value="2">2option>

    <option value="3">3option>

select>

<script type="text/javascript">

    $("select[title=SelectNumer]").change(function() {

        alert('you choose: ' + $(this).attr("value"));

        $("div[title=DivB]").append("

Here

");

    });

    script>

    form>

body>

html>

Click

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

    <title>title>

    <script src="jquery-1.4.1-vsdoc.js" type="text/javascript">script>

    <script src="jquery-1.4.1.js" type="text/javascript">script>   

head>

<body>

    <form id="form1" runat="server">

    <input type="button" value="OK" id="btnOK" class="clsOK"/>

    <input type="button" value="Cancel" id="btnCancel" class="clsCancel"/>  

    <script type="text/javascript">

        $(":button#.clsOK").click(function() {

            alert('you choose: ' + $(this).attr("value"));

        });

    script>

    form>

body>

html>

Blur

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

    <title>title>

    <script src="jquery-1.4.1-vsdoc.js" type="text/javascript">script>

    <script src="jquery-1.4.1.js" type="text/javascript">script>   

head>

<body>

    <form id="form1" runat="server">

    <input type="text" value="Quoc hung" id="txtUserName" />

    <input type="text" value="123456" id="txtPassword" />

    <script type="text/javascript">

        $("#txtUserName").blur(function() {

            alert('you move: '+$(this).attr("value"));

        });

    script>

    form>

body>

html>


Selector
Selector / #id

html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>title>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.js">script>

   <script type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js">script>

   <script type="text/javascript">

       $(document).ready(function () {

           alert($("#txtUserName").attr("value"));

       }

      );

   script>

head>

<body>

    <form id="form1" runat="server">

    <div>

        <input id="txtUserName" value="Quoc Hung" type="text" />

    div>

    form>

body>

html>

Selector / Element

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>title>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js">script>

   <script type="text/javascript">

       $(document).ready(function () {

           $("div").css("border", "3px solid yellow").css("width", "200px") ;

       }                               

       );

   script>

head>

<body>

    <form id="form1" runat="server">

      <div>

        <input id="txtUserName" value="Quoc Hung" type="text" />

      div>

    form>

body>

html>

Selector / .Class

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>title>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js">script>

   <script type="text/javascript">

       $(document).ready(function () {

           $(".test").css("border", "4px solid violet").css("width", "200px");

       }

       );

   script>

head>

<body>

    <form id="form1" runat="server" class="test">

    <div>

        <input id="txtUserName" value="Quoc Hung" type="text" />

    div>

    form>

body>

html>

Selector *

<head runat="server">

    <title>title>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1.js">script>

    <script type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js">script>

    <script type="text/javascript">

        $(document).ready(function () {

  &n



     

Further Readings:

Responses

No response found. Be the first to respond this post

Post Comment

You must Sign In To post reply
Find More code samples in C#, ASP.Net, Vb.Net and more Here

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend