API tools faq
paste
Advertisement
deyanivanov966

Упражнение 6 Банков Решения на задачи за упражнение (1)

deyanivanov966
Jan 13th, 2022
775
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 4.74 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Document</title>
  6.     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  7.     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css">
  8.     <script>
  9.         document.addEventListener('DOMContentLoaded', () => {
  10.            
  11.             let selects = document.querySelectorAll('.user-select');
  12.             selects[0].addEventListener('change', (e) => {
  13.                 selects[1].value = selects[0].value;
  14.             });
  15.  
  16.             let inputs = document.querySelectorAll('.email-field');
  17.             inputs[0].addEventListener('input', (e) => {
  18.                 inputs[1].value = inputs[0].value;
  19.             });
  20.  
  21.             let checkbox = document.querySelectorAll('.subscribe-field');
  22.             checkbox[0].addEventListener('change', (e) => {
  23.                 checkbox[1].checked = e.target.checked ? true : false;
  24.             });
  25.  
  26.             let textareas = document.querySelectorAll('textarea');
  27.             textareas[0].addEventListener('input', (e) => {
  28.                 console.log(e);
  29.                 textareas[1].value = textareas[0].value;
  30.             });
  31.         });
  32.   </script>
  33. </head>
  34. <body>
  35.     <div class="container">
  36.         <div class="row flex-row ">
  37.             <div class="col-6 mt-3">
  38.                 <div class="form-group">
  39.                     <select class="form-select user-select">
  40.                         <option selected="">Избери потребител</option>
  41.                         <option value="1">Иван Иванов</option>
  42.                         <option value="2">Мария Петрова</option>
  43.                         <option value="3">Стефан Колев</option>
  44.                         <option value="4">Петя Илиева</option>
  45.                         <option value="5">Деница Филева</option>
  46.                         <option value="7">Красимир Жечев</option>
  47.                         <option value="8">Здравко Стоянов</option>
  48.                         <option value="10">Катерина Момчилова</option>
  49.                         <option value="11">Панчо Панчев</option>
  50.                         <option value="15">Елица Стоинева</option>
  51.                   </select>
  52.                 </div>
  53.             <div class="form-group">
  54.                 <label for="">Имейл</label>
  55.                 <input type="text" class="form-control email-field">
  56.             </div>
  57.             <div class="form-check">
  58.                 <label class="form-check-label">
  59.                     <input class="form-check-input subscribe-field" type="checkbox" value="">
  60.                     Абонирай ме!
  61.                 </label>
  62.             </div>
  63.             <div class="form-group">
  64.                 <label for="">Напиши съобщение</label>
  65.                 <textarea name="" id="" cols="20" rows="5" class="form-control"></textarea>
  66.             </div>
  67.         </div>
  68.         <div class="col-6 mt-3">
  69.             <div class="form-group">
  70.                 <select class="form-select user-select">
  71.                     <option selected="">Избери потребител</option>
  72.                     <option value="1">Иван Иванов</option>
  73.                     <option value="2">Мария Петрова</option>
  74.                     <option value="3">Стефан Колев</option>
  75.                     <option value="4">Петя Илиева</option>
  76.                     <option value="5">Деница Филева</option>
  77.                     <option value="7">Красимир Жечев</option>
  78.                     <option value="8">Здравко Стоянов</option>
  79.                     <option value="10">Катерина Момчилова</option>
  80.                     <option value="11">Панчо Панчев</option>
  81.                     <option value="15">Елица Стоинева</option>
  82.                 </select>
  83.             </div>
  84.             <div class="form-group">
  85.                 <label for="">Имейл</label>
  86.                 <input type="text" class="form-control email-field">
  87.             </div>
  88.             <div class="form-check">
  89.                 <label class="form-check-label">
  90.                     <input class="form-check-input subscribe-field" type="checkbox" value="">
  91.                     Абонирай ме!
  92.                 </label>
  93.             </div>
  94.             <div class="form-group">
  95.                 <label for="">Напиши съобщение</label>
  96.                 <textarea name="" id="" cols="20" rows="5" class="form-control"></textarea>
  97.             </div>
  98.         </div>
  99.     </div>
  100. </body>
  101. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!