So my dear programmers, to understand JavaScript event, you just have to understand the meaning of event word. Event means any single movement. Now what movement we have to do on the computer, or we have to play with the mouse or we have to play with the keyboard. So whatever you are doing with the mouse and whatever you are doing with the are called events You are clicking mouse, you are hovering mouse You are pressing a key on keyboard All of them are called events There are four types of even
ts in JavaScript First of all, we have mouse event Mouse event Second, we have keyboard event Mouse event Keyboard event Farm event Window event First we have mouse event we have 6 types of mouse event first we have click we have to click with mouse click and on second number we have to overwrite mouse on any element then mouse up mouse down mouse leave mouse up, mouse down, mouse leave, and mouse move so we have 6 type of mouse events here we click, here we hover the mouse over an element here
we move the mouse up or down, leave or move. So we have 6 type of mouse events. On second number we have keyboard event. Keyboard events are of two types. Key up and Key down. Now what is the meaning of Key up and key down now what is the meaning of key up and key down whenever we press any key on keyboard we call it key down we have made it down and when we leave it we call it key up whenever we have to press a button we have to leave it and the second event is key down and key up or key up and
key down press button and leave it so we have two type of keyboard event key up and key down then we have form event we have four type of form event first one is submit submit second one is first number is submit submit second number is blur when input is blur then we have focus when we have to focus on an element or input and fourth number is change when we write data in input then value of that data is changing so that is also an advantage we have change whenever we write any data in input th
en value of that data is changing so that is also an event at last we have window event so we have three types of window event first one is onload onload second one is unload unload when you are not loading window 2. Unload when you are not loading windows 3. Resize so we have some events first we have mouse event which we have to do with mouse we call it mouse event we have 6 types of mouse event click, over, up, Down, Leave and Move Keyboard event Keyboard event is of 2 types Key up and key do
wn Press and hold the keys Form Form event is of 4 types Submit the form Blur the input Focus form, we have 4 type of form event submit form, blur on any input, focus when we click and write any data in it, we call it focus and when we write any data, we call it change so we have 4 type of format, submit, blur, focus, change last we have window event Window Event have 3 types On Load when we want to load window On Load when window is not loading and Resize when we want to resize window when we w
ant to resize window we call it Resize when we want to resize window we call it Resize so we have all these events now we will see them practically on computer so first of all we will discuss mouse events to add mouse event you have to add button tag and you can write any text in it i will write click me and where you can add its attributes class, id and all other things you can add event here by default its events are present like you will click on on so all the events on on all these are down
the events i have taught you those are the maximum you use, other than that if you count its events only javascript, so it is more than 100 but all i have taught you this is more than enough, you don't use it completely. We are using just 4 or 5 events in the project building. But when the project requirements come, then the person can search the event online. But otherwise you do not need the maximum. You will not use all the things I have explained to you. Just onclick, onmouse, move, you are
using one or two of these. When you are in have a big advanced project in which game development etc you use it for that you need to search online you know the application how you apply you can easily see it once and apply it main is how you implement you put on click here and whenever you want to put an event you have to put it like this You can type onclick Whenever you want to implement an event You can type event onclick, onmousemove onmousehover or any other event then equal sign and double
quotes In double quotes You have to write javascript code You can write directly You can write directly in this you can also write directly in alert box and the best method is that you write a function in javascript file and you can call that function on click so i write a function in main.js function and i name it myfun now i am executing any code in this so i am writing document.write and in this we are writing hello barber save it now when i will apply function i mean when i have applied myf
un then i will apply myfun and when i will click on it myfun, myfunction and as I click on it, we will get hello barber, in the same way if you put on mouse over mouse over now as I will put mouse over we will get hello barber print in the same way, whatever functionality apply any functionality on it through this process Now all the events that I have explained to you, if you are using VS Code For example, you have to write on and m All the events are on mouse, all of them are down You have to
check all of them, onSubmit, onMouseUp, onMouseWheel Now we will make it wheel, on most up, on most wheel, or we also call it wheel, on most on, there are many more, I am also seeing some of them for the first time, because so many people do not learn, just we have to learn as much as we have to use. So all the elements I have explained to you, you have to apply all of them, after applying, then tell tell me in comment section who has applied. so the process is simple you can click on almost don
e, you save it now when you hover over the mouse button now when you bring it back click on it and bring it back, this is called mouse down when you do this, the event will be applied same like this, other events are very easy you can apply it once, hover it, click it, move the mouse and check it once after that we have input event so input event is first keyboard event that also apply on input you can take input tag here and we will put on key up now you can see the same function is applied on
input now you can see the same function is applied on input now you can see the same function is applied on input now you can see the same function is applied on input now you can see the same function is applied on input now you can see the same function is applied on input now you can see the same function is applied on input now you can see the same function is applied on input now you can see the same function is applied on input now you can see the same function is applied on input now you
can see the same function is applied on input now you can see the same function is applied on input now you can see the same function is applied on input now you can and your function will be applied now i will put an alert here because with alert you will understand more hello save it, now when i write a text in it you will get a hello because if we have pressed on the button now i am pressing it, now when i will leave it it is called on key up when I will leave it It is called onkeyup Means yo
ur key is pressed and up Your function will be called Now here we have Onkeydown, we can also use that Onkeydown This one, save it Now when I will click on any key Then the function will be called Onkeyup and onkeydown That is here You can also put it by name if i click any key then function will be called onkeyup and onkeydown you can also name it onkeypress and onkeydown so these are the input commands other than this focus and blur if you want to focus then you will put onfocus when you focus
on input then function will be applied in the same way you have to attach css after that we have farm submit this is very important event you use it a lot for that you take farm tag you don't have to put action on farm here you have to type on submit when you submit farm i call the same function here and here we will take input tag input and we will type text and then we will take button tag and type submit and you can write any text in it, submit, save and reload the page now when I will click
on submit button then on submit event will be called now you have farm event and keyboard event after that we have window event window event is also very easy for that you can directly apply it on the body or if you are applying it on a div then you can apply it on that too but mostly it is used on the body so here we apply it on load on load But most of the time, it is used on the body So here we will put Onload We will put alert box directly on it Save it Now as soon as your page will load We
will get alert box Similarly, we will put resize Whenever we will resize our page Onresize when we resize our page on resize on resize when we hold it and resize it this function will be applied same way on unload and other events you can apply it on all of them on blur, on can play, on change, on click all of your events will be applied on it you can apply all of them but your main three on load, on unload and on resize we use window committee so much we don't use more than this sometimes we d
on't use this most important events are mouse and keyboard events you have to focus on them and also on input, farm image you can learn as much as you want you can do any kind of project in terms of image I hope you like the video if you like the video, please like if you are visiting the channel for the first time, please subscribe InshaAllah we will meet in the next video in the next video. Until then, Allah Hafiz. till then Allah Hafiz
Comments
❤❤❤❤
Kamal k lectures hain Bhai MashAllah❤❤❤❤