Focus-in и Focus-out «активный» класс добавить / удалить поведение - PullRequest
0 голосов
/ 30 августа 2018

У меня есть функция для добавления и удаления «активного» класса в соответствии с поведением focus / click в определенном «input» классе, когда focusin добавляет класс, при щелчке снаружи он должен удалить его, но он этого не делает .

var inptxt = $('.form-component.input-text input')
$(inptxt').on('focusin', 
   function(){
     $(this).parent().addClass('active');
   }).on('focusout', function(){
     $(this).parent().removeClass('active');

  });

Спасибо за вашу помощь!

Ответы [ 2 ]

0 голосов
/ 30 августа 2018

Ваш код правильный. Всего несколько синтаксических ошибок в вашем коде

 inptxt = $('.form-component.input-text input')  //  ;  end with semicolumn 

 $(inptxt')        //replace with $(inptxt)  

var inptxt = $('.form-component.input-text input');
$(inptxt).on('focusin', 
   function(){
     $(this).parent().addClass('active');
   }).on('focusout', function(){
     $(this).parent().removeClass('active');

  });
div.active {
  background-color:rgb(128, 128, 128);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-component input-text">
  <input type="text">
</div>
0 голосов
/ 30 августа 2018

Ваша логика работает нормально. В вашем вопросе чего-то не хватает, что идентифицирует проблему?

$('.form-component.input-text input').on('focus', 
   function(){
     $(this).parent().addClass('active');
   }).on('focusout', function(){
     $(this).parent().removeClass('active');

  });
div.active {
  background-color:rgb(128, 128, 128);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-component input-text">
  <input type="text">
</div>
...