Skip to main content

Jquery - Event

In this article of Jquery we will learn about Event so Let's start.




@{
    ViewBag.Title = "Events";
}

<h2>
    Events
</h2>


<!DOCTYPE html>

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <script src="~/js/Event.js" type="text/javascript"></script>

</head>




<body>



    <!--The function is executed when the user double-clicks on the HTML element:-->
    <h3>The function is executed when the user double-clicks on the HTML element:</h3>
    <p>This is para</p>
    <p>Second para</p>
    <p>Third para</p>
    <!--End-->
    <br /><br /><br /><br /><br /><br />







    <!--The function is executed when the mouse pointer enters the HTML element:-->
    <h3>The function is executed when the mouse pointer enters the HTML element:</h3>
    <p id="para1">This is para</p>
    <!--End-->
    <br /><br /><br /><br /><br /><br />







    <!--The function is executed when the mouse pointer leaves the HTML element:-->
    <h3>The function is executed when the mouse pointer leaves the HTML element:</h3>
    <p id="mouseLeave">This is para</p>
    <!--End-->
    <br /><br /><br /><br /><br /><br />



    <!--The function is executed, when the left, middle or right mouse button is pressed down, while the mouse is over the HTML element:-->
    <h3>The function is executed, when the left, middle or right mouse button is pressed down, while the mouse is over the HTML element:</h3>
    <p id="mouseDown">This is para</p>
    <!--End-->
    <br /><br /><br /><br /><br /><br />




    <!--The function is executed when the form field gets focus:-->
    <h3>The function is executed when the form field gets focus:</h3>
    <input type="text" />
    <input type="text" />
    <!--End-->





<script>

$(document).ready(function () {

    $("p").dblclick(function () {

        $(this).hide();
    });




    $("#para1").mouseenter(function () {
        alert("This is para")
    });



    $("#mouseLeave").mouseleave(function () {
        alert("You are leaving para")
    });


    $("#mouseDown").mousedown(function () {
        alert("This is para")
    });


    $("input").focus(function () {

        $(this).css("background-color","white")
    });


    $("input").blur(function () {
        $(this).css("background-color","lightgrey")
    });

});

</script>






</body>
</html>

Comments

Post a Comment

Popular posts from this blog

CRUD Operation in ASP.NET MVC Using ADO.NET Jquery Ajax

In this article of ASP.NET MVC we will learn about CRUD operation using jquery ajax so let's start. Firstly open visual studio: Go to File => New and Select Project,when you select project then New Project Dialogbox will appear. Select ASP.NET Web Application (.NET Framework) and give a name to your project , as we are building CRUD Operation so our project's name could be CRUD_OPEATION and then select OK. Now you will see a new dialogbox, select Empty Template and MVC folder. After create project you will see a like screen like this: Now go to Models folder and add ADO.NET Entity Data Model and give any name like in my case i give dbEntities and selec OK: After that you will see a dilogbox called Entity Data Model Wizard, select EF Designer from database and select Next: After that a new dilogbox will appear and it will ask a new connection to your sql server, then select New Connection and give server name ( if you want to see your server name then open sql server,it will ...
Post a Comment
Read more

Showing List of database Using Jquery, Ajax and Datatable

In this article of ASP.NET MVC we will learn about Showing List of database Using Jquery, Ajax and Datatable so let's start: Firstly create a model class which you want to show a list of datatable.In my case i create a model class namely called GEN_TaskMaster:  public class GEN_TaskMaster     {         public long sysTaskID { get; set; }         public long sysUserID { get; set; }                  public DateTime Task_Date { get; set; }         public string Task_Assign_To { get; set; }         public string Task_Assign_From { get; set; }         public string Task_Description { get; set; }                 } Then go to your controller and paste a code below: public ActionResult ListAll()         {             var list = db.Database...
Post a Comment
Read more

ASP.NET MVC - Get Started

ASP.NET is a free web framework for building websites and web applications on .NET Framework using HTML, CSS, and JavaScript. These tutorials are designed for beginners and professionals who want to learn ASP.NET MVC 5. In the next article we will learn How to Create First Asp.net MVC application. Click Here To Create First MVC Application
Post a Comment
Read more