Javascript-форум - Показать сообщение отдельно - Как правильно склонировать блок, если инпуты в блоке находится в фокусе

рони · #3 (**permalink**) 03.12.2019, 20:36

kos0760,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
  <style type="text/css">
.row {
  margin-top: 30px;
}

form{
   counter-reset: num;
}
form .col-form-label span:after{
   counter-increment: num ;
   content:  counter(num);

}
form .panels:last-of-type input{
    background-color: #F0E68C;
}

  </style>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script>
jQuery(function($) {
$('form').on('focus', '.panels:last', function() {
   $(this).clone().insertAfter(this)
})
});
  </script>


</head>

<body>

<div class="container">
  <form>
  <div class="row panels">
    <div class="col-2">
      <label for="staticEmail" class="col-form-label">Панель №<span></span></label>
    </div>
    <div class="col">
      <input type="text" class="form-control" placeholder="Ширина">
    </div>
    <div class="col">
      <input type="text" class="form-control" placeholder="Высота">
    </div>
  </div>
</form>
</div>

</body>

</html>