View Categories

JavaScript Events

4 min read

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 бүлгүүдээс үйл явдал, үйл явдлын зохицуулагчдын талаар илүү их зүйлийг сурч мэдэх болно.

Powered by BetterDocs

Leave a Reply