• Μέθοδοι αντικειμένων παραθύρου.
  • Μέθοδος alert(): σύντομη περίληψη.
  • μέθοδος επιβεβαίωσης() - γράφω γράμματα;
  • μέθοδος prompt() - ας γνωριστούμε, είμαι ο Stirlitz.

Έτσι, τα αντικείμενα του προγράμματος περιήγησης. Και πρώτα απ 'όλα - το παλαιότερο από αυτά, το αντικείμενο παράθυρο.

Εδώ είναι οι κύριες μέθοδοι του αντικειμένου παράθυρο(εκτός από αυτά υπάρχουν και άλλα, αλλά ελάχιστα ωφελούν και για να μην μπουκώνω τον εγκέφαλο με περιττές πληροφορίες, θα τα αναβάλω μέχρι την τρίτη σειρά).

Μέθοδος

Περιγραφή

Άνοιγμα και κλείσιμο των παραθύρων του προγράμματος περιήγησης. είναι δυνατό να προσδιοριστεί το μέγεθος του παραθύρου, τα περιεχόμενά του, καθώς και η παρουσία πληκτρολόγιο, πεδία διεύθυνσης και άλλα χαρακτηριστικά.

Εμφάνιση πλαισίου διαλόγου συναγερμού με αντίστοιχο μήνυμα.

Εμφάνιση ενός πλαισίου διαλόγου επιβεβαίωσης με τα κουμπιά "OK" και "Cancel".

Εμφάνιση ενός παραθύρου διαλόγου με ένα πεδίο εισαγωγής κειμένου.

Ρύθμιση ή κατάργηση εστίασης για ένα παράθυρο.

Μετακινεί τα περιεχόμενα ενός παραθύρου σε ένα συγκεκριμένο σημείο.

Ρύθμιση του χρονικού διαστήματος μεταξύ κλήσης συνάρτησης και αξιολόγησης έκφρασης.

Ρύθμιση ενός χρονικού διαστήματος πριν από μια κλήση συνάρτησης ή αξιολόγηση έκφρασης.

Το ξέρουμε ήδη παράθυροσυχνά υπονοούμενο αλλά όχι ορθογραφικό.

Κλήση διαφόρων πλαισίων διαλόγου

Τα πλαίσια διαλόγου χρησιμοποιούνται σε προγράμματα για την αλληλεπίδραση με τον χρήστη.

μέθοδος alert().

Το αναλύσαμε στην αρχή των σπουδών μας. Δημιουργεί ένα απλό παράθυρο διαλόγου με ένα μήνυμα και ένα κουμπί ΟΚ. Όλη η αλληλεπίδρασή του περιορίζεται στο γεγονός ότι ο χρήστης, πατώντας αυτό το μόνο κουμπί, μπορεί να στείλει αυτό το παράθυρο κάπου μακριά (και ευχαριστώ για αυτό).

μέθοδο επιβεβαίωσης().

Μέθοδος επιβεβαιώνω()επιτρέπει ήδη στον χρήστη να λάβει την απλούστερη "boolean" απόφαση: να πει "ναι" ή "όχι".

Για παράδειγμα, κάντε κλικ σε αυτό το κουμπί:

Συγγνώμη για τη μικρή φάρσα. Ελπίζω να γνωρίζετε πώς να χρησιμοποιείτε το κουμπί πίσω.

Πώς είναι όλα τακτοποιημένα; Είδατε φυσικά ότι έχω αυτή τη μέθοδο σε συνδυασμό με ειδοποιήσεις. Και αυτό γίνεται με τη βοήθεια της συνάρτησης που εισάγεται .

Η μέθοδος επιστρέφει δύο τιμές: αληθής(αν είναι εντάξει) και ψευδής(αν ακυρωθεί).

ΣΤΟ αληθήςτο στέλνουμε στην αντίστοιχη σελίδα (ιδιότητα hrefαντικείμενο τοποθεσία) και βγάζουμε το αντίστοιχο συναγερμός(). Διαφορετικά (δηλ. ψευδής) απλά βγάζετε ένα άλλο συναγερμός().

Και στο κουμπί καλούμε τη συνάρτηση στο συμβάν στο κλικ:

Στη συνέχεια, πρέπει να καλέσετε αυτήν τη συνάρτηση από το πρόγραμμα χειρισμού συμβάντων onΥποβολήετικέτα

, για παράδειγμα:

"http://narod.yandex.ru/send-poll.xhtml"μέθοδος = "ανάρτηση" onSubmit= "return confirmAction()" >

Εδώ, για παράδειγμα, μπορείς να μου γράψεις στο «σαπούνι» ό,τι σκέφτεσαι για τα μαθήματά μου. Εάν ξαφνικά ενθουσιαστήκατε και πατήσατε το κουμπί και μετά έγινε κάπως άβολο, θα εμφανιστεί ένα παράθυρο διαλόγου και θα σας ξεσηκώσει.

Εάν κάνετε αναδυόμενα παράθυρα, είναι καλή πρακτική να προειδοποιήσετε τον χρήστη και να του δώσετε την επιλογή να ανοίξει το παράθυρο ή όχι. Για να το κάνετε αυτό, πριν φορτώσετε το παράθυρο, πρέπει να απελευθερώσετε το παράθυρο διαλόγου "parliamenter". επιβεβαιώνω(). Εδώ η συνάρτηση καλείται από . Θα μιλήσουμε για αυτό πολύ σύντομα όταν προχωρήσουμε στη δημιουργία παραθύρων χρησιμοποιώντας τη μέθοδο Άνοιξε().

μέθοδος prompt().

Αυτή η μέθοδος ζητά ήδη από τον χρήστη συγκεκριμένα δεδομένα. Εμφανίζεται ένα πλαίσιο διαλόγου με ένα πεδίο εισαγωγής. Η μέθοδος επιστρέφει τα δεδομένα που εισήγαγε ο χρήστης σε αυτό το πεδίο και επιτρέπει στο πρόγραμμα να εργαστεί με αυτά τα δεδομένα.

Στη μέθοδο προτροπή()δύο ορίσματα: μια ερώτηση (που εμφανίζεται πάνω από το πεδίο εισαγωγής) και μια απάντηση (το κείμενο στο πεδίο εισαγωγής):

Εάν θέλετε το πεδίο εισαγωγής να εμφανίζεται καθαρό, βάλτε κενά εισαγωγικά ως δεύτερο όρισμα:

προτροπή("κείμενο ερώτησης","")

Ας το δούμε στην πράξη. Πατήστε το κουμπί, μην φοβάστε.

Έτσι, εισαγάγατε (ή δεν εισαγάγατε) δεδομένα και λάβατε μια απάντηση από τον υπολογιστή με βάση αυτά τα δεδομένα (ή την έλλειψή τους).

Εδώ είναι μια απλή έκδοση αυτής της λειτουργίας:

Ιδιοκτησία innerHTML, που σας επιτρέπει να ελέγχετε τα περιεχόμενα της ετικέτας, γνωρίσαμε στο μάθημα 10, όταν προγραμματίσαμε τα ονόματα κάτω από τις εικόνες.

Και εδώ είναι ο κωδικός για το κουμπί και η κενή παράγραφος για τον χαιρετισμό.


Αλλά αν αποδειχθείς ότι είσαι ο συνονόματός μου, είδατε ότι η συνάρτηση αντέδρασε και σε αυτό.

Πώς να το κάνετε αυτό στην "πρόχειρη" έκδοση, μπορείτε ήδη να μαντέψετε μόνοι σας. Πρέπει να ελέγξετε τη μεταβλητή όνομα χρήστηόχι μόνο σε κενά εισαγωγικά, αλλά και σε " Ανδρέας", και προσθέστε ένα ακόμη ανμε το κατάλληλο κείμενο (μπορείτε να εξασκηθείτε μόνοι σας).

Αλλά αν πληκτρολογήσετε " Ανδρέας", "Andryusha", "Andryushka", "Andryukha", "Andreyka", "Αντρέι Ιβάνοβιτς", κ.λπ., τότε το αποτέλεσμα θα είναι παρόμοιο, αν και δεν πέρασα ρητά όλες αυτές τις τιμές, αλλά κατάφερα μόνο πέντε γραμμές: " Αντρέ", "Ανδρέας", "Ανδρέας", "Αντρέιτσε" και " Αντρέιτσου"(οι τρεις τελευταίοι - για να αποκλειστούν οι Andreev, Andreichenko και Andreichuk από τους συνονόματους, διατηρώντας παράλληλα τον Andreichik στους συνονόματους).

Δηλαδή, μπορείτε να μαντέψετε ότι η συνάρτηση ελέγχει τη μεταβλητή όνομα χρήστηγια τους πρώτους 5, 6 ή 8 χαρακτήρες.

Αλλά θα μιλήσουμε για αυτό λίγο αργότερα, όταν θα προχωρήσουμε στα αντικείμενα χορδών και στις μεθόδους τους. Θέλω απλώς να φανταστείτε εκ των προτέρων τις εργασίες που πρέπει να λύσουμε (ιδιαίτερα, κάθε είδους διαχωρισμός χορδών σε υποχορδές). Τότε οι ίδιες οι αποφάσεις θα φαίνονται πιο ξεκάθαρες. Αν όμως δεν μπορείτε να περιμένετε, μπορείτε να «αντιγράψετε» τη συνάρτηση από τον κωδικό και να την «κόψετε σαν παξιμάδι». Για τους περίεργους, έγραψα ένα σχόλιο εκεί.

Μέθοδος προτροπή()μπορεί επίσης να χρησιμοποιηθεί για την εισαγωγή κωδικού πρόσβασης.

Αυτό δεν είναι το τέλος του μαθήματος!

Ας «παίξουμε κατάσκοπος» λίγο για να ολοκληρώσουμε την ανάγνωση αυτού του κεφαλαίου. Πρώτα, δοκιμάστε να πατήσετε το κουμπί και να πληκτρολογήσετε κάτι.

Α, αυτό είναι! Αλλά κοίτα, υπάρχει ένα άλλο κουμπί! Ελα...

Κωδικός πρόσβασης:

Πατήστε ξανά το πρώτο κουμπί και πληκτρολογήστε τον σωστό κωδικό πρόσβασης.

Όλη αυτή η διασκέδαση, ίσως, έχει αποτέλεσμα, αλλά στην πραγματικότητα ο κωδικός μπορεί να βρεθεί πατώντας δεξί κουμπίκαι κοιτάζοντάς το σε κώδικα. Κάποιοι μπορεί αφελώς να πιστεύουν ότι αρκεί να βάλουμε τον κώδικα σε ένα ξεχωριστό αρχείο .js. Αλλά στον κώδικα της σελίδας θα υπάρχει ένας σύνδεσμος προς αυτό το αρχείο με τη διεύθυνση. Και αν το καλέσετε γραμμή διεύθυνσης, τότε θα ανοίξει ένα αρχείο με κώδικα JavaScript :)

Είναι δυνατή η κρυπτογράφηση του κωδικού πρόσβασης σε κώδικα; Μπορείτε, αλλά αυτό απαιτεί και πάλι χειρισμό συμβολοσειράς μαζί με τη χρήση ορισμένων μαθηματικών μεθόδων. Όταν φτάσουμε σε όλα αυτά, θα μελετήσουμε επίσης το σενάριο του «πραγματικού» κωδικού πρόσβασης. Αλλά η τεχνική αλληλεπίδρασης με τον χρήστη θα εξακολουθεί να είναι η ίδια: η μέθοδος προτροπή(). (Είναι δυνατόν να "σπάσετε" έναν κρυπτογραφημένο κωδικό πρόσβασης; Αλίμονο, δεν υπάρχει όριο στην τελειότητα των χάκερ ...)

Με τον ίδιο τρόπο που «πιάσαμε» το όνομα ή την απουσία του, θα πιάσουμε τον κωδικό πρόσβασης με τη συνάρτηση.

Εάν εισάγετε λανθασμένο κωδικό πρόσβασης ή δεν εισάγετε τίποτα, η γραμμή

document.getElementById("no").style.display = "block"

ανοίγει το μπλοκ με το δεύτερο κουμπί

Και εάν εισαχθεί ο σωστός κωδικός πρόσβασης, η ενέργεια μεταφέρεται στη συμβολοσειρά

document.getElementById("yes").style.display = "block",

που ανοίγει το επόμενο μπλοκ

Σταμάτα, τι είναι αυτά τα kryakozubry; Αυτή είναι μια απλή κρυπτογράφηση, θα σας εξηγήσω σύντομα.

Εν τω μεταξύ, δίνω τον κωδικό αυτών των μπλοκ (για λόγους σαφήνειας, παραλείπω τον πίνακα με τα πλαίσια, τον οποίο έχω εσωκλείσει στο τελευταίο μπλοκ):


"όχι" style="display: none;" >

Α, αυτό είναι! Αλλά κοίτα, υπάρχει ένα άλλο κουμπί! Ελα...




"mypassword" style="display: none;" >

Κωδικός πρόσβασης:


Πατήστε ξανά το πρώτο κουμπί και πληκτρολογήστε τον σωστό κωδικό πρόσβασης.



"ναι" style="display: none;" >

Τώρα διαβάζουμε περαιτέρω.


. . . . .
. . . . .

Λοιπόν, σχετικά με την κρυπτογράφηση. Είναι πολύ άθλια. Οποιος, γνωρίζοντας λειτουργίες διαφυγή()και unescape(), θα το χακάρει αμέσως.

Λειτουργία escape ("εισαγωγή συμβολοσειράς εδώ")μετατρέπει τους χαρακτήρες στις δεκαεξαδικές τιμές τους.

Λειτουργία unescape ("insert quackaubers here")κάνει το αντίθετο.

Για να κρυπτογραφήσετε τον κωδικό πρόσβασης με αυτόν τον τρόπο, πρέπει να τον μεταφέρετε στο σπίτι διαφυγή(), αντιγράψτε το αποτέλεσμα και επικολλήστε το unescape(). Αλλά αυτό, επαναλαμβάνω, δεν είναι σοβαρό.

Λοιπόν, για πλήρες σετ- λειτουργία για το δεύτερο κουμπί:

Στο πρότυπο εξόδου παράθυρα διαλόγουΗ JavaScript έχει μόνο τρεις μεθόδους που μάθαμε σήμερα. Αν και αυτές οι μέθοδοι δεν συμβαίνουν πολύ συχνά, η δυνατότητα χρήσης τους με σιγουριά είναι εξαιρετικά χρήσιμη. Είναι απλά, αλλά ταυτόχρονα είναι, θα λέγαμε, «καθαρός» προγραμματισμός. Είναι πολύ καλά για να σας γεμίσουν το χέρι στο mastering μιας γλώσσας προγραμματισμού. Και σας συμβουλεύω να πειραματιστείτε μαζί τους με κάθε δυνατό τρόπο, έστω και άσκοπα από πραγματιστική άποψη. καλός προγραμματισμός- αυτό είναι ένα συναρπαστικό παιχνίδι, όπως, πράγματι, κάθε δημιουργικότητα.

Σε αυτό το μάθημα, θα γνωρίσουμε τις μεθόδους του αντικειμένου παραθύρου: alert() , prompt() και confirm() .

μέθοδος alert().

Η μέθοδος alert() προορίζεται για την εμφάνιση ενός πλαισίου διαλόγου προειδοποίησης με το καθορισμένο μήνυμα και ένα κουμπί ΟΚ στην οθόνη του χρήστη. Μπορεί να χρησιμοποιηθεί για να μεταφέρει σημαντικές πληροφορίες στον χρήστη.

window.alert(Parameter_1);

Η μέθοδος alert() έχει μία απαιτούμενη παράμετρο, η οποία είναι το κείμενο του μηνύματος που εμφανίζεται στο παράθυρο διαλόγου. Αυτή η μέθοδος δεν επιστρέφει τίποτα ως αποτέλεσμα της εκτέλεσής της.

Για παράδειγμα, ας εμφανιστεί ένα πλαίσιο διαλόγου προειδοποίησης για έναν επισκέπτη ιστότοπου όταν κάνει κλικ σε έναν σύνδεσμο: Μεταβείτε στον ιστότοπο

μέθοδο επιβεβαίωσης().

Η μέθοδος επιβεβαίωσης() του αντικειμένου παραθύρου προορίζεται για την εμφάνιση ενός πλαισίου διαλόγου με το καθορισμένο μήνυμα και τα κουμπιά ΟΚ και Ακύρωση στην οθόνη του χρήστη. Μπορείτε να χρησιμοποιήσετε το παράθυρο επιβεβαίωσης για να ζητήσετε από τον χρήστη άδεια να εκτελέσει μια ενέργεια.

var resultConfirm = επιβεβαίωση(Parameter_1);

Αυτή η μέθοδος έχει μία παράμετρο - το κείμενο του μηνύματος που θα εμφανιστεί στο παράθυρο διαλόγου.

Η μέθοδος confirm() επιστρέφει μία από τις δύο τιμές ως αποτέλεσμα (resultConfirm) της εκτέλεσής της:

  • αληθές εάν ο χρήστης έκανε κλικ στο OK.
  • false αν ο χρήστης έκανε κλικ στο Cancel ή το έκλεισε.

Για παράδειγμα, ας εμφανίσουμε στο στοιχείο p με id="resultConfirm" το αποτέλεσμα του χρήστη που κάνει κλικ στο κουμπί "OK" στο πλαίσιο διαλόγου:

μέθοδος prompt().

Η μέθοδος prompt() έχει σχεδιαστεί για να εμφανίζει ένα παράθυρο διαλόγου με ένα μήνυμα, ένα πεδίο κειμένου για την εισαγωγή δεδομένων και τα κουμπιά "OK" και "Cancel" στην οθόνη του χρήστη. Προορίζεται να ζητήσει δεδομένα από τον χρήστη.

var resultPrompt = prompt(Parameter_1, Parameter_2);

Αυτή η μέθοδος έχει δύο παραμέτρους:

  • μήνυμα που θα εμφανιστεί στο παράθυρο διαλόγου. Αυτή η παράμετρος είναι απαραίτητη και περιέχει ένα μήνυμα που "λέει" ποια δεδομένα πρέπει να εισάγει ο χρήστης στο πεδίο κειμένου.
  • η δεύτερη παράμετρος είναι προαιρετική και μπορεί να χρησιμοποιηθεί για τον καθορισμό της αρχικής τιμής που θα εμφανίζεται στο πεδίο εισαγωγής του πλαισίου διαλόγου όταν ανοίξει.

Ανάλογα με τις ενέργειες του χρήστη, η μέθοδος prompt() μπορεί να επιστρέψει τα ακόλουθα δεδομένα:

  • τιμή κειμένου - εάν το πεδίο εισαγωγής περιέχει δεδομένα και ο χρήστης έκανε κλικ στο "OK".
  • κενή συμβολοσειρά - εάν το πεδίο εισαγωγής δεν περιέχει δεδομένα και ο χρήστης έκανε κλικ στο "OK".
  • null - εάν ο χρήστης έκανε κλικ στο "Ακύρωση" ή έκλεισε αυτό το παράθυρο, δεν έχει σημασία ποια δεδομένα εισήχθησαν στο πεδίο κειμένου.

Σημείωση: Το πλαίσιο διαλόγου που εμφανίζεται ως αποτέλεσμα της εκτέλεσης μιας από τις μεθόδους alert() , confirm() ή prompt() είναι modal, π.χ. αποκλείει την πρόσβαση του χρήστη στη γονική εφαρμογή (πρόγραμμα περιήγησης) έως ότου ο χρήστης κλείσει το παράθυρο διαλόγου.

Για παράδειγμα, θα ζητήσουμε από τον χρήστη ένα όνομα και, ανάλογα με το αποτέλεσμα, θα εμφανίσουμε το κείμενο στο στοιχείο c id="nameUser" :

Για παράδειγμα, ας ζητήσουμε από τον χρήστη να μαντέψει τον αριθμό 8:

... Μαντέψτε τον αριθμό

Η οργάνωση ενός διαλόγου με έναν επισκέπτη σε έναν πόρο Ιστού μπορεί να πραγματοποιηθεί διαφορετικοί τρόποι, των οποίων χρήση Λειτουργίες JavaScriptΗ alert() είναι η απλούστερη και ταχύτερη επιλογή. Αυτή η επιλογή είναι ιδιαίτερα καλή για δοκιμαστικούς σκοπούς, αλλά σε πολλούς πόρους χρησιμοποιείται ως φυσική λειτουργία.

Η συνάρτηση JavaScript alert() σάς επιτρέπει να λάβετε μια καταφατική απάντηση. Στην πραγματικότητα, δεν είναι η απάντηση που είναι σημαντική, αλλά το ίδιο το γεγονός της παραγωγής πληροφοριών. Επιπλέον, ο πόρος Ιστού παύει να λειτουργεί μέχρι να ανταποκριθεί ο χρήστης. Η απάντηση στην ειδοποίηση είναι πάντα η ίδια - αυτή είναι η απάντηση!

Για σκοπούς εντοπισμού σφαλμάτων, το JavaScript alert() είναι το τέλειο εργαλείο για να λαμβάνετε γρήγορα ενημερωμένες πληροφορίες, να λαμβάνετε αποφάσεις και να συνεχίζετε την εργασία σας. Αλλά για τον σκοπό της κανονικής λειτουργίας του ιστότοπου, έχει επίσης αρκετά πλεονεκτήματα.

Τραβώντας την προσοχή του επισκέπτη

"Alert" - όπως στη ζωή, σχηματίζει ένα γεγονός που δεν μπορεί να περάσει. Αλλά αυτό το συμβάν μπορεί να συμβεί ή να μην συμβεί..

Ένας σπάνιος προγραμματιστής έχει επίγνωση αυτής της περίστασης και διενεργεί επίπονη μακρά διόρθωση σφαλμάτων στον ιστότοπό του στην πλευρά του πελάτη. Ταυτόχρονα, λίγοι προγραμματιστές δεν γνωρίζουν: είναι συχνά τόσο δύσκολο να βρεθεί ένα σφάλμα στον πελάτη, δηλαδή στο πρόγραμμα περιήγησης, ώστε:

  • Ώρες πολύτιμου χρόνου χάνονται.
  • ξοδεύονται απίστευτοι μετασχηματισμοί κώδικα.
  • πολλά σενάρια είναι φτυαρισμένα, με λόγια, τόσο το πρόγραμμα περιήγησης όσο και ο διακομιστής το καταλαβαίνουν.

Και δεν υπάρχει αποτέλεσμα. Ούτε τα προγράμματα εντοπισμού σφαλμάτων βοηθούν, ούτε οι λέξεις, ούτε τα εργαλεία εντοπισμού σφαλμάτων που είναι ενσωματωμένα σε κάθε πρόγραμμα περιήγησης. Εν τω μεταξύ, το στήθος ανοίγει πάντα - το σωστό κλειδί είναι σημαντικό.

Ένας απλός κανόνας σωστού κώδικα

Πρώτα απ 'όλα, τα cookies έχουν γίνει το πιο απαιτητικό στοιχείο ενός σύγχρονου ιστότοπου. Δεν πρέπει ποτέ να ξεχνάτε:

  • Ειδοποίηση JavaScript & cookie εγγράφων
  • "εδώ και τώρα" & "καθόλου ή κάποια μέρα".

Τα cookies είναι μια καλή λειτουργία που πρέπει να θυμάστε στα βάθη του προγράμματος περιήγησης για κάθε πελάτη, αλλά δεν πρέπει να δίνετε σημασία σε αυτό στην τρέχουσα περίοδο λειτουργίας. Κύριο μέλημα των cookies είναι να παραμείνει στη «μνήμη» του προγράμματος περιήγησης στο περιεχόμενο που είχε τη στιγμή που έφυγε ο επισκέπτης.

Από όλες τις άλλες απόψεις, ο κώδικας σεναρίου στα έγκατα του προγράμματος περιήγησης εξαρτάται μόνο από τον εαυτό του και τα συμβάντα που επεξεργάζεται.

Σε αυτό το πλαίσιο, και αυτό το πλαίσιο είναι ιδανικό εδώ, ο κώδικας δεν μπορεί να μην λειτουργεί εάν είναι γραμμένος σωστά. Αυτός είναι ο ιδανικός κανόνας για σωστό κώδικα. Εάν το πρόγραμμα περιήγησης εμφανίζει μια κενή οθόνη ή κάνει κάτι λάθος, υπάρχει λόγος να υποθέσουμε ότι υπάρχει σφάλμα.

Πιο εύκολο στην εφαρμογή:

  • Ειδοποίηση JavaScript ("Όλα ήταν καλά μέχρι στιγμής!").

Το καλύτερο πρόγραμμα εντοπισμού σφαλμάτων ή εντοπισμού σφαλμάτων είναι ένα γεγονός που πρέπει να συμβεί αλλά δεν συμβαίνει.

Μετακινώντας αυτήν την κατασκευή από το μηδέν σε ένα ενοχλητικό έγκλημα στον κώδικα, μπορείτε να βρείτε το μέρος μετά το οποίο δεν λειτουργεί. Το σφάλμα θα βρεθεί. Το JavaScript alert() είναι τροπικό παράθυρο. Δεν μπορεί να παρακαμφθεί με κανέναν τρόπο και τίποτα δεν θα συμβεί έως ότου ο προγραμματιστής / επισκέπτης κλείσει αυτό το παράθυρο.

Εάν το παράθυρο δεν εμφανιστεί, τότε είτε υποδεικνύεται λανθασμένα στον κωδικό είτε οτιδήποτε εμφανίζεται πριν περιέχει σφάλμα.

Δύσκολη κατάσταση όπου η ειδοποίηση JavaScript δεν φαίνεται να λειτουργεί

Αυτό αφορά κυρίως αλγόριθμους AJAX για την ανταλλαγή πληροφοριών με τον διακομιστή. Δεν είναι πάντα αποδεκτή η χρήση κλασικών εργαλείων εντοπισμού σφαλμάτων εδώ και όταν η πλευρά του πελάτη πολυεπίπεδο σύστημααντικείμενα, τότε ο εντοπισμός σφαλμάτων γενικά μετατρέπεται στο μυαλό του προγραμματιστή και κανένα πρόγραμμα εντοπισμού σφαλμάτων δεν μπορεί να βοηθήσει.

Η καλύτερη επιλογή για μια ειδοποίηση στη διαδικασία επικοινωνίας με τον διακομιστή είναι ένα div (div), στο οποίο τοποθετείται το πρωτόκολλο για την επικοινωνία με τον διακομιστή χρησιμοποιώντας τη μέθοδο innerHTML - θα είναι πάντα σαφές σε ποιο στάδιο παρουσιάζεται το πρόβλημα.

Το στατικό div που είναι πάντα ορατό στη σελίδα δεν είναι ένας τρόπος ειδοποίησης JavaScript. Το παράθυρο μπορεί να μην εμφανίζεται και μπορεί να υπάρχουν πολλοί λόγοι για αυτό και είναι συντακτικά σωστοί. Η γλώσσα του προγράμματος περιήγησης έχει μια εξαιρετικά ήρεμη διάθεση και δεν θα προβεί ποτέ σε καμία ενέργεια εάν δεν έχει αναλύσει και κατανοήσει κάτι.

Η στατική φύση οποιασδήποτε ετικέτας HTML είναι καλό. Αφαιρέστε όλο τον κώδικα και προσθέστε τον τμηματικά μέχρι να εμφανιστεί ξανά το σφάλμα - όχι το καλύτερο γρήγορη τεχνολογίαγια αποσφαλμάτωση. Το να γράφεις σωστά είναι δημοφιλής συμβουλή, σε ζήτηση, αλλά όχι πρακτική.

Η γλώσσα του προγράμματος περιήγησης καθοδηγείται από συμβάντα, το κύριο μέλημά του δεν είναι ο διαδοχικός κώδικας αλλά η εκτέλεση λειτουργιών που έχουν εκχωρηθεί σε ετικέτες σελίδας και ο χειρισμός συμβάντων.

Πρόσθετος κανόνας σε έναν απλό κανόνα

Εάν το παράθυρο από την ειδοποίηση JavaScript ("Μέχρι στιγμής όλα είναι γραμμένα σωστά") δεν εμφανίστηκε στο πρόγραμμα περιήγησης, σημαίνει ότι η σύνταξη μέχρι το σημείο όπου γράφεται αυτή η κατασκευή δεν προκαλεί αμφιβολίες στο πρόγραμμα περιήγησης και εκτελείται σωστά.

Λογική μοντέρνΤα γράμματα έχουν ένα σημαντικό μειονέκτημα. Όλα τα αρχεία σελίδας συγχωνεύονται μαζί (με την ουσία και τους τύπους τους) σε ένα σύνολο και μετά δημιουργείται το DOM. Η σειρά με την οποία συνδέονται τα αρχεία είναι συχνά σημαντική.

Είναι καλύτερο όταν ο προγραμματιστής δεν αποδίδει σημασία στην αρχή του συμβάντος της οργάνωσης της εκτέλεσης των λειτουργιών που έχουν ανατεθεί σε συμβάντα, αλλά τακτοποιεί όλες τις λειτουργίες με τη σειρά της εφαρμογής τους και την ανάθεση σε ετικέτες σελίδας και συμβάντα.

Η τάξη είναι πάντα το πιο σημαντικό. Η JavaScript θα καταλάβει τα υπόλοιπα από μόνη της: τι και πότε να καλέσει. Ο σύγχρονος προγραμματισμός γενικά και στο πλαίσιο οποιασδήποτε μεθόδου, οποιασδήποτε εξαιρετικά οργανωμένης αντικειμενοστρεφούς προσέγγισης ειδικότερα, είναι πάντα συνεπής. συνδυάζονται πάντα διαδοχικά όπως περιγράφονται.

Αν κάτι δεν συμβεί, σημαίνει: όχι κάπου κάτι δεν πάει καλά, αλλά μόνο μπροστά σε αυτό το μέρος.

Στο JavaScript, υπάρχουν τρεις βασικές λειτουργίες που σας επιτρέπουν να λαμβάνετε δεδομένα από τον χρήστη για περαιτέρω επεξεργασία σε σενάρια. Αυτά είναι προειδοποίηση, προτροπή και επιβεβαίωση. Τι χρησιμοποιούνται, πώς να τις χρησιμοποιήσετε και άλλες αποχρώσεις θα συζητηθούν αργότερα σε αυτό το άρθρο.

συναγερμός

Χρησιμοποιείται για την εμφάνιση ενός παραθύρου modal στην οθόνη του προγράμματος περιήγησης (αυτό σημαίνει ότι ο χρήστης δεν μπορεί να κάνει κλικ σε τίποτα στη σελίδα μέχρι να κλείσει αυτό το παράθυρο. Σε αυτό το παράδειγμα, μέχρι να κάνει κλικ στο "OK" στο παράθυρο).

Μετά την εμφάνιση του μηνύματος που περιέχεται στην ειδοποίηση, η εκτέλεση του σεναρίου αναστέλλεται και συνεχίζεται μετά το κλείσιμο του παραθύρου.

Σε περίπτωση πλήρωσηςπεδία και κάνοντας κλικ στο OK, το σενάριο θα επιστρέψει τις πληροφορίες που εισήγαγε ο χρήστης.

Η σύνταξη αυτής της εντολήςκάπως πιο περίπλοκο από το προηγούμενο, καθώς σας επιτρέπει να ορίσετε το κείμενο της ένστασης του χρήστη και τα περιεχόμενα του πεδίου για την εισαγωγή πληροφοριών, τα οποία θα εμφανίζονται από προεπιλογή: αποτέλεσμα = προτροπή(τίτλος, προεπιλογή) ;, όπου

  • τίτλος- ένα μήνυμα που θα εμφανιστεί στον χρήστη στο παράθυρο modal. Το επιχείρημα απαιτείται.
  • Προκαθορισμένο- τι θα εμφανίζεται στο πεδίο εισαγωγής κειμένου από προεπιλογή. Απαιτείται επίσης να συμπληρωθεί, γιατί εάν δεν έχει οριστεί, μπορεί να οδηγήσει σε σφάλματα σε ορισμένα προγράμματα περιήγησης. Εάν θέλετε να αφήσετε κενό το πεδίο εισαγωγής, τότε απλώς ορίστε την προτροπή ως εξής:

    var myTest = prompt("Any info" , """);

Μικρό παράδειγμα άμεσης χρήσης:

var έτος = προτροπή( «Τι χρονιά αποφοίτησες από το λύκειο;», 2008); alert("Είστε απόφοιτος του " + έτος + " της χρονιάς!" ) ;

Συνήθως, αυτή η εντολή χρησιμοποιείται για τη συλλογή δεδομένων από χρήστες που χρειάζεται το σενάριο για να συνεχίσει την περαιτέρω εργασία.

επιβεβαιώνω

Είναι επίσης ένα τροπικό παράθυρο. Καθώς δεν είναι δύσκολο να μαντέψει κανείς από το όνομα, συνήθως χρησιμοποιείται για να συμφωνήσει σε κάτι με τον χρήστη.

Ακονισμένο για αυτό - για αλληλεπίδραση, παρέχει στον χρήστη τα κουμπιά OK και CANCEL, τα οποία επιστρέφουν τις τιμές boolean true και false στο σενάριο, αντίστοιχα. Βαθμολογίες: 4 (μέσος όρος 4 στα 5 )

Σε αυτό το άρθρο, θα εξερευνήσουμε τρεις ενδιαφέρουσες μεθόδους, συγκεκριμένα μεθόδους alert(), confirm() και prompt().. Όλοι αυτοί προορίζεται για αλληλεπίδραση με τον χρήστη.

Και οι τρεις αυτές μέθοδοι ανήκουν στο αντικείμενο window. Και μπορούν να ονομαστούν ως εξής: window.method_name(); Όμως, η JavaScript μας επιτρέπει να μην καθορίσουμε αυτό το αντικείμενο παραθύρου, αλλά απλώς να γράψουμε το όνομα της μεθόδου.

Θα ξεκινήσουμε με τη μέθοδο alert(). Αυτή η μέθοδος εμφανίζει το καθορισμένο μήνυμα στο παράθυρο του προγράμματος περιήγησης του χρήστη. Αυτό το πλαίσιο θα εμφανίζεται στην κορυφή ολόκληρης της σελίδας και μέχρι ο χρήστης να κάνει κλικ στο κουμπί OK, δεν θα κλείσει.

Για να το δείξουμε, ας εμφανίσουμε κάποιο μήνυμα χρησιμοποιώντας τη μέθοδο ειδοποίησης ().

var today_is = "Δευτέρα"; alert("Σήμερα είναι " + σήμερα_είναι);


Μέσα στη μέθοδο, μπορούμε να καθορίσουμε οποιαδήποτε συμβολοσειρά, μόνο χωρίς ετικέτα html ov. Δεν υποβάλλονται σε επεξεργασία εδώ, αλλά εμφανίζονται ως έχουν.

Εάν η συμβολοσειρά που θέλουμε να καθορίσουμε είναι πολύ μεγάλη και θέλουμε να μεταπηδήσουμε νέα γραμμή, τότε εδώ είναι η ετικέτα html
δεν θα λειτουργήσει. Εδώ πρέπει να χρησιμοποιήσετε τον χαρακτήρα "\n".

Alert("Loooooooooong \nStringgggggg");


Αυτή η μέθοδος χρησιμοποιείται συχνά για να βρείτε ένα σφάλμα στον κώδικα.

Η διαδικασία επεξεργασίας του κώδικα πηγαίνει από πάνω προς τα κάτω, οπότε για να εντοπίσουμε ένα σφάλμα, γράφουμε απλώς τη μέθοδο ειδοποίησης () στην περιοχή που προορίζεται όπου βρίσκεται το σφάλμα. Και αν η alert() λειτούργησε, τότε δεν υπάρχουν σφάλματα μέχρι τη γραμμή όπου είναι γραμμένο.

Στη συνέχεια, πρέπει να το μετακινήσετε μία ή περισσότερες γραμμές παρακάτω. Αποθηκεύουμε τις αλλαγές, ανανεώνουμε ξανά τη σελίδα στο πρόγραμμα περιήγησης και βλέπουμε αν η alert() λειτούργησε, πράγμα που σημαίνει ότι δεν υπάρχουν σφάλματα πριν από τη γραμμή όπου βρίσκεται, διαφορετικά, Εάν δεν λειτούργησε, το σφάλμα βρίσκεται στη γραμμή πάνω από το σημείο που βρίσκεται αυτήν τη στιγμή. Με αυτόν τον τρόπο, μπορείτε να βρείτε ένα σφάλμα στον κώδικα.

μέθοδο επιβεβαίωσης().

Αυτή η μέθοδος χρησιμοποιείται για να επιβεβαιώσει την απάντηση σε κάποια ερώτηση. Υπάρχουν μόνο δύο επιλογές απάντησης, ναι (OK) ή όχι (Ακύρωση / Ακύρωση). Εάν ο χρήστης απαντήσει ναι, τότε η μέθοδος επιστρέφει true, διαφορετικά επιστρέφει false.

Για παράδειγμα, θα εμφανίσουμε ένα παράθυρο χρησιμοποιώντας τη μέθοδο επιβεβαίωσης(), όπου θα ρωτήσουμε τον χρήστη "Είστε βέβαιοι ότι θέλετε να φύγετε από τη σελίδα;". Εάν ο χρήστης απαντήσει ναι, τότε μέσω της μεθόδου alert() θα εμφανίσουμε ένα τέτοιο μήνυμα "Ο χρήστης θέλει να φύγει από τη σελίδα", διαφορετικά θα εμφανίσουμε ένα άλλο μήνυμα "Ο χρήστης ΔΕΝ θέλει να φύγει από τη σελίδα".

Var user_answer = confirm("Είστε βέβαιοι ότι θέλετε να φύγετε από τη σελίδα;"); if(user_answer) alert("Ο χρήστης θέλει να φύγει από τη σελίδα"); else alert("Ο χρήστης ΔΕΝ θέλει να \nαποχωρήσει από τη σελίδα");


Έτσι λειτουργεί η μέθοδος επιβεβαίωσης(). Μπορεί να χρησιμοποιηθεί σε διάφορες περιπτώσεις. Για παράδειγμα, πριν διαγράψετε κάτι από τον ιστότοπο, συνηθίζεται να ρωτάτε τον χρήστη εάν είναι σίγουρος για τις ενέργειές του. Ή, πριν υποβάλετε τη φόρμα, μπορείτε επίσης να ρωτήσετε τον χρήστη «Συμπληρώσατε τα πάντα σωστά;» Εάν απαντήσει ναι, τότε η φόρμα θα σταλεί, διαφορετικά δεν θα σταλεί.

μέθοδος prompt().

Και η τελευταία μέθοδος που θα μάθουμε είναι η μέθοδος prompt(). Αυτή η μέθοδος χρησιμοποιείται λιγότερο συχνά από τις άλλες δύο μεθόδους. Σας επιτρέπει να λαμβάνετε κάποιες πληροφορίες από τον χρήστη, τις οποίες θα εισάγει στο πεδίο κειμένου.

Ως αποτέλεσμα, η μέθοδος prompt() επιστρέφει είτε τη συμβολοσειρά εισόδου εάν ο χρήστης έκανε κλικ στο κουμπί OK, είτε μηδενική εάν ο χρήστης έκανε κλικ στο κουμπί ακύρωσης.

Ως παράμετρος δηλαδή μέσα στις αγκύλες αυτή τη μέθοδομπορούμε να γράψουμε μια προτροπή ή μια ερώτηση για να ενημερώσουμε τον χρήστη ποιες πληροφορίες πρέπει να εισάγει.

Για παράδειγμα, ας ζητήσουμε από τον χρήστη να απαντήσει στην ερώτηση "Πώς είναι το όνομά σου;". Το όνομα που εισήγαγε ο χρήστης θα εμφανιστεί στην οθόνη χρησιμοποιώντας τη μέθοδο alert().

Varname = προτροπή ("Ποιο είναι το όνομά σου;"); alert("Το όνομά σας είναι " + όνομα);

Αποθηκεύστε και ανοίξτε τη σελίδα στο πρόγραμμα περιήγησης.


Φυσικά, οποιαδήποτε πληροφορία μπορεί να εισαχθεί στο πεδίο κειμένου από τη μέθοδο prompt(). Αυτές οι πληροφορίες θα επιστραφούν ως συμβολοσειρά, ακόμη και στην περίπτωση αριθμών ή άλλων ειδικών χαρακτήρων.

Για παράδειγμα, ας ζητήσουμε από τον χρήστη να εισάγει δύο αριθμούς για να τους πολλαπλασιάσει αργότερα. Θα υπάρχει μια αριθμομηχανή για τον πολλαπλασιασμό των αριθμών.

Var x = prompt("Εισαγάγετε τον πρώτο αριθμό:"); var y = prompt("Εισαγάγετε τον δεύτερο αριθμό:"); //Μετατροπή των εισαγόμενων αριθμών από τύπο συμβολοσειράς σε αριθμητικό τύπο x = Number(x); y = αριθμός(y); document.write(x + " * " + y + " = " + (x * y));

Οι αριθμοί που εισάγονται είναι συμβολοσειρές, επομένως για το σωστό αποτέλεσμα του πολλαπλασιασμού, αυτοί οι αριθμοί πρέπει να περάσουν από τη συνάρτηση Number(), η οποία τους μετατρέπει από τύπο συμβολοσειράς σε κανονικούς αριθμούς.

Λοιπόν, αυτό είναι όλο. Τώρα γνωρίζετε τρεις ακόμη μεθόδους: alert(), confirm() και prompt(). Το οποίο μπορείτε να χρησιμοποιήσετε με ασφάλεια στην πράξη.