ბრაუზერის თავდაპირველი პარამეტრების გადალახვა (ვიდეო ვერსია)

ახლა კიდევ ერთი რაღაც მინდა გაჩვენო,
რაც შეიძლება გააკეთო ობიექტით 'event'.

ვებ-გვერდი, რომელიც მე შევქმენი
პასუხობს საუკუნის კითხვას:

"რას ამბობს ოჰარა?"

ან, უფრო ზუსტად რომ ვთქვათ, რას იტყოდა
ოჰარა, მისი გაგონება რომ შეგეძლოთ?

თუ ბმულზე გადახვალ, აღმოაჩენ mp3 ფაილს

რომელიც უნდა ჩაირთოს შენს ბრაუზერში
და გაგცეს პასუხი ამ საჭირბოროტო კითხვაზე.

მაგრამ მე არ მინდა, რომ მომხმარებელს
გვერდის დატოვება უწევდეს;

მინდა, რომ ფაილის მოსმენა გვერდზევე შეეძლოს.

ამის გაკეთება JavaSript-ით შეიძლება,
თეგით

რომელიც დაუკრავს ფაილს, როცა მომხმარებელი
დააჭერს ბმულს.

პირველ რიგში, შევინახოთ ბმული ცვლადში.

[ბეჭდავს]

ახლა განვსაზღვროთ გამოძახების ფუნქცია.

ეს საკმაოდ საინტერესო პროცესი უნდა იყოს.

ამ უკუგამოძახების ფუნქციით გვინდა
აუდიო თეგის დინამიკური შექმნა

[ბეჭდავს]

ეს ახალი, ძალიან კარგი თეგი მუშაობს
თანამედროვე ბრაუზერებში.

audio.src უნდა უდრიდეს..

იმას, რაც აქ ზემოთ არის 'href' -
აუდიო და ვიზუალური თეგები ჰგავს ერთმანეთს.

შემდეგ უნდა ჩავწეროთ, რომ
`audioEl.autoplay = true' -

ასე ფაილი ჩაირთვება,
როგორც დავამატებთ მას გვერდზე

დაბოლოს, სწორედ ეს უნდა ვქნათ - დავამატოთ
ფაილი გვერდზე.

მნიშვნელობა არ აქვს, სად ჩავსვამ მას

იმიტომ რომ ვიზუალურად არსად არ გამოჩნდება.

მოკლედ ახლა ბმულზე დაწკაპუნებისას
უნდა შექმნას აუდიო, განისაზღვროს წყარო,

დაყენდეს ავტომატური დაკვრა და
დაემატოს გვერდზე.

დაბოლოს, უნდა დავრწმუნდეთ, რომ
ბმულზე დაჭერისას

გამოიძახება event listener.

[ბეჭდავს]

და ბოლოს უბრალოდ ვწერთ ფუნქციის სახელს.

წესი იცი: დააპაუზე ტუტორიალი
და სცადე დამოუკიდებლად.

♪ ხმა ♪

რა მოხდა?

ჩემთან ისმის ოჰარას ხმას

მაგრამ ბმული მაინც ახალ ფანჯარაში იხსნება.

იდეალურ ვარიანტში, როცა აუდიო დაიკვრება,
ბრაუზერმა აღარ უნდა გადაიყვანოს

მომხმარებელი ბმულზე, იმიტომ რომ
ხმა უკვე გაიგონეს.

ამის მისაღწევად უნდა ვუბრძანოთ ბრაუზერს
შეწყვიტოს თავდაპირველი ქცევა.

როგორც ხედავთ, თავდაპირველი პარამეტრებით,
როცა მომხმარებელი აჭერს ბმულს,

ბრაუზერს იგი ამ ბმულზე გადაყავს.

მაგრამ ხშირად ჩვენ ჩვენს წესებს ვუწერთ
JavaScript-ით

იმიტომ რომ არ გვინდა, რომ ბრაუზერი ბმულზე
გადადიოდეს.

ამისთვის ვიყენებთ 'even'-ის თვისებას,

რომელსაც ჰქვია 'preventDefault()'

უნდა მივმართოთ მოვნელის ობიექტს

და აქ, შიგნით, ჩავწეროთ
'e.preventDefault()'

ეს შეატყობინებს ბრაუზერს, რომ
ამ მოვლენასთან ასოცირებული

თავდაპირველი ქცევა უნდა შეწყდეს.

ახლა დააპაუზეთ ტუტორიალი და სცადეთ
თავიდან.

ახლა უბრალოდ ხმა გაიგონეთ, ხომ ასეა?

ეს პროდუქტის მოხმარებას უფრო
სასიამოვნოს ხდის.

ასეთ ცვლილებებს ეძახიან
"პროგრესულ დატვირთვას"

როცა ვებ-გვერდი იწყება როგორც HTML
ბრაუზერის ქცევის თავდაპირველი პარამეტრებით

და შემდეგ JavaScript-ით იტვირთება,
უკეთესი სამომხმარებლო გამოცდილების მისაღებად.

ამ 'preventDefault'-ს ხშირად გამოიყენებ,

როცა ბმულებზე რამე მოსასმენს განათავსებ.

შეიძლება ასევე ფორმების პროცესის დროსაც
გამოიყენო,

იმიტომ რომ ბრაუზერს ამ შემთხვევისთვისაც
აქვს რაღაც განსაზღვრული თავდაპირველი პარამეტრები,

მაგ. სერვერთან დაკავშირების.

მთავარია, ყოველთვის ვფიქრობდეთ
მომხმარებლის გამოცდილებაზე,

და თუ ის არ არის ოპტიმალური
შენს ვებ-გვერდზე

უნდა მოიფიქრო, როგორ შეიძლება მისი გაუმჯობესება.

აქ შეიძლება ყველაფერი ვერ გასწავლოთ,

მაგრამ ინტერნეტში ყველა კითხვაზე იპოვი
პასუხს.