-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
92 lines (44 loc) · 4.32 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!DOCTYPE html> <!-- This line declares the document type and version of HTML -->
<html lang="en"> <!-- This tag defines the beginning of the HTML document and sets the language to English -->
<head> <!-- This tag contains meta-information about the HTML document and links to external resources -->
<meta charset="UTF-8"> <!-- This meta tag specifies the character encoding for the document -->
<title>Gender Prediction WebPage</title> <!-- This tag sets the title of the HTML document -->
<link rel="stylesheet" type="text/css" href="css/styles.css"> <!-- This tag links the HTML document to an external stylesheet -->
</head>
<body> <!-- This tag contains the content of the HTML document -->
<div class="box"> <!-- This tag creates a container with the class "box" -->
<div class="container"> <!-- This tag creates a container with the class "container" -->
<div class="left-column"> <!-- This tag creates a container with the class "left-column" -->
<h2>Mr. or Ms. ?</h2> <!-- This tag creates a heading with the text "Mr. or Ms. ?" -->
<form id="myForm" onsubmit="handleSubmit(event)"> <!-- This tag creates a form with the id "myForm" and specifies the submission event handler -->
<label for="name">Name:</label> <!-- This tag creates a label for an input field with the id "name" -->
<input type="text" onchange="savedStorage(event)" id="textInput" name="textInput" maxlength = "255" pattern="[A-Za-z\s]*" required> <!-- This tag creates a text input field with the id "textInput" and specifies event handlers, attributes, and restrictions -->
<div class="radio-group"> <!-- This tag creates a container with the class "radio-group" for radio buttons -->
<label> <!-- This tag creates a label for a radio button -->
<input type="radio" value="male" id="male radio" name="apiOption" > <!-- This tag creates a radio button with the value "male" and the id "male radio" within the group "apiOption" -->
Male <!-- This text is displayed as the label for the radio button -->
</label>
</div>
<div class="radio-group"> <!-- This tag creates another container with the class "radio-group" for radio buttons -->
<label> <!-- This tag creates a label for a radio button -->
<input type="radio" value="female" id="female radio" name="apiOption" > <!-- This tag creates a radio button with the value "female" and the id "female radio" within the group "apiOption" -->
Female <!-- This text is displayed as the label for the radio button -->
</label>
</div>
<button type="submit" id="prediction">Submit</button> <!-- This tag creates a submit button with the id "prediction" -->
</form>
<button onclick="handleSave(event)" id="save">Save</button> <!-- This tag creates a button with an onclick event handler and the id "save" -->
</div>
<div class="right-column" > <!-- This tag creates a container with the class "right-column" -->
<h2>Prediction</h2> <!-- This tag creates a heading with the text "Prediction" -->
<p id="response gender"></p> <!-- This tag creates an empty paragraph element with the id "response gender" -->
<p id="response probability"></p> <!-- This tag creates an empty paragraph element with the id "response probability" -->
<h2>Saved Answer</h2> <!-- This tag creates a heading with the text "Saved Answer" -->
<p id="saved"></p> <!-- This tag creates an empty paragraph element with the id "saved" -->
<button id="clear" onclick="handleClear(event)">Clear</button> <!-- This tag creates a button with the id "clear" and an onclick event handler -->
</div>
<script type="text/javascript" src="js/script.js"></script> <!-- This tag links the HTML document to an external JavaScript file -->
</div>
</div>
</body>
</html>