HTML events are “things” that happen to HTML elements.
HTML үйл явдлууд нь HTML элементүүдэд тохиолддог “зүйл” юм.
When JavaScript is used in HTML pages, JavaScript can “react” on these events.
JavaScript-ийг HTML хуудсанд ашиглахад JavaScript нь эдгээр үйл явдалд “хариу үйлдэл үзүүлэх” боломжтой.
HTML Events #
An HTML event can be something the browser does, or something a user does.
HTML үйл явдал нь browser-ийн хийдэг зүйл эсвэл хэрэглэгчийн хийдэг зүйл байж болно.
Here are some examples of HTML events:
HTML үйл явдлын зарим жишээг энд оруулав.
- An HTML web page has finished loading
HTML вэб хуудас ачаалж дууслаа
- An HTML input field was changed
HTML оролтын талбарыг өөрчилсөн
- An HTML button was clicked
HTML товчлуур дарагдсан
Often, when events happen, you may want to do something.
Ихэнх тохиолдолд, үйл явдал тохиолдвол та ямар нэгэн зүйл хийхийг хүсч магадгүй юм.
JavaScript lets you execute code when events are detected.
JavaScript нь үйл явдал илэрсэн үед код гүйцэтгэх боломжийг танд олгоно.
HTML allows event handler attributes, with JavaScript code, to be added to HTML elements.
HTML нь JavaScript код бүхий үйл явдлын зохицуулагчийн шинж чанаруудыг HTML элементүүдэд нэмэх боломжийг олгодог.
With single quotes:
Нэг ишлэлээр:
<element event=‘some JavaScript‘>
With double quotes:
Давхар эшлэлтэй:
<element event=“some JavaScript“>
In the following example, an onclick attribute (with code), is added to a element:
Дараах жишээнд onclick шинж чанарыг (кодтой) элементэд нэмж оруулсан болно.
Example Жишээ #
<button onclick="document.getElementById('demo').innerHTML = Date()">The time is?</button> In the example above, the JavaScript code changes the content of the element with id=”demo”.
Дээрх жишээнд JavaScript код нь элементийн агуулгыг id = “demo” болгож өөрчилдөг.
In the next example, the code changes the content of its own element (using this.innerHTML):
Дараагийн жишээнд код нь өөрийн элементийн агуулгыг өөрчилдөг (this.innerHTML ашиглан):
Example Жишээ #
<button onclick="this.innerHTML = Date()">The time is?</button> JavaScript code is often several lines long. It is more common to see event attributes calling functions:
JavaScript код нь ихэвчлэн хэд хэдэн мөртэй байдаг. Үйл ажиллагааг дуудах үйл явдлын шинж чанарыг харах нь илүү түгээмэл байдаг:
Example Жишээ #
<button onclick="displayDate()">The time is?</button> Common HTML Events #
Нийтлэг HTML үйл явдлууд #
Here is a list of some common HTML events:
Зарим нийтлэг HTML үйл явдлын жагсаалтыг энд оруулав:
| Event | Description |
|---|---|
| onchange | An HTML element has been changed
HTML элемент өөрчлөгдсөн |
| onclick | The user clicks an HTML element
Хэрэглэгч HTML элемент дээр дарна |
| onmouseover | The user moves the mouse over an HTML element
Хэрэглэгч хулганаа HTML элемент дээр шилжүүлдэг |
| onmouseout | The user moves the mouse away from an HTML element
Хэрэглэгч хулганаа HTML элементээс холдуулдаг |
| onkeydown | The user pushes a keyboard key
Хэрэглэгч гарын товчлуурыг дардаг |
| onload | The browser has finished loading the page
Хөтөч хуудсыг ачаалж дуусав |
The list is much longer: Apprentice JavaScript Reference HTML DOM Events.
Жагсаалт хамаагүй урт байна: Apprentive.mn JavaScript лавлагаа HTML DOM үйл явдлууд.
What can JavaScript Do? #
JavaScript юу хийж чадах вэ? #
Event handlers can be used to handle and verify user input, user actions, and browser actions:
Үйл явдлын зохицуулагчийг хэрэглэгчийн оролт, хэрэглэгчийн үйлдэл, хөтчийн үйлдлийг хянах, шалгахад ашиглаж болно.
- Things that should be done every time a page loads
Хуудсыг ачаалах бүрт хийх ёстой зүйлс
- Things that should be done when the page is closed
Хуудсыг хаах үед хийх ёстой зүйлүүд
- Action that should be performed when a user clicks a button
Хэрэглэгч товчлуур дээр дарахад хийгдэх ёстой үйлдэл
- Content that should be verified when a user inputs data
Хэрэглэгч өгөгдөл оруулах үед баталгаажуулах ёстой агуулга
- And more …
Бусад …
Many different methods can be used to let JavaScript work with events:
JavaScript-ийг үйл явдлуудтай ажиллах боломжийг олгохын тулд олон янзын аргыг ашиглаж болно.
- HTML event attributes can execute JavaScript code directly
HTML үйл явдлын шинж чанарууд нь JavaScript кодыг шууд гүйцэтгэх боломжтой
- HTML event attributes can call JavaScript functions
HTML үйл явдлын шинж чанарууд нь JavaScript функцийг дуудаж болно
- You can assign your own event handler functions to HTML elements
HTML элементүүдэд өөрийн үйл явдлын зохицуулагчийн функцийг оноож өгч болно
- You can prevent events from being sent or being handled
Та үйл явдлыг илгээх эсвэл зохицуулахаас урьдчилан сэргийлэх боломжтой
- And more …
Бусад …
You will learn a lot more about events and event handlers in the HTML DOM chapters.
HTML DOM бүлгүүдээс үйл явдал, үйл явдлын зохицуулагчдын талаар илүү их зүйлийг сурч мэдэх болно.
