diff --git a/js-essentials/character-count/README.md b/js-essentials/character-count/README.md new file mode 100644 index 0000000..8e2dfb1 --- /dev/null +++ b/js-essentials/character-count/README.md @@ -0,0 +1,9 @@ +# Character count + +Display the number of characters a user has typed into a textarea +element in real time as they type. + +# Reference + +* https://leanwebclub.com/learn/js-essentials/project-character-count/ + diff --git a/js-essentials/character-count/index.html b/js-essentials/character-count/index.html new file mode 100644 index 0000000..130a38f --- /dev/null +++ b/js-essentials/character-count/index.html @@ -0,0 +1,17 @@ + + + + + + + Character count + + +

Character count

+ + +

You've written 0 characters.

+ + + + diff --git a/js-essentials/character-count/script.js b/js-essentials/character-count/script.js new file mode 100644 index 0000000..61f6a96 --- /dev/null +++ b/js-essentials/character-count/script.js @@ -0,0 +1,7 @@ +let counter = document.querySelector("#character-count"); +let textarea = document.querySelector('#text'); + +textarea.addEventListener('input', function (event) { + counter.innerText = event.target.value.length; +}); + diff --git a/js-essentials/main.go b/js-essentials/main.go index 3915909..2a8519f 100644 --- a/js-essentials/main.go +++ b/js-essentials/main.go @@ -12,6 +12,7 @@ func main() { mux.Handle("GET /toggle-password-visibility/", http.StripPrefix("/toggle-password-visibility", http.FileServer(http.Dir("toggle-password-visibility")))) mux.Handle("GET /toggle-multiple-fields/", http.StripPrefix("/toggle-multiple-fields", http.FileServer(http.Dir("toggle-multiple-fields")))) mux.Handle("GET /toggle-multiple-forms/", http.StripPrefix("/toggle-multiple-forms", http.FileServer(http.Dir("toggle-multiple-forms")))) + mux.Handle("GET /character-count/", http.StripPrefix("/character-count", http.FileServer(http.Dir("character-count")))) log.Println("Start the web server...") err := http.ListenAndServe(":8080", mux)