javascript - Jquery 单选按钮焦点不起作用

Question

大家好，我正在做一些自定义单选按钮样式，但 css :focus 不起作用。所以我正在找出一些 js 解决方案，现在我有这个:

// Focuse radio btn
  function focus() {
   $('.radio, .field-label').focusin(function(e) {
   //console.log(e.target);
   $(e.target).parent().animate({opacity: .5},400);
});

$('.radio, .field-label').focusout(function(e) {
  //console.log('focus out!');
  $('.radio, .field-label').parent().animate({opacity: 1},1000);
});
}

focus(); 

这适用于 Chrome。但在 safari 或 mozilla 等其他浏览器中，它不起作用。为什么？任何解决方案？ 谢谢!

Answer 1

试试这个:

function focus() {
    $(document).on('focus', '.radio, .field-label', function(e) {
       //console.log(e.target);
       $(this).parent().animate({opacity: .5},400);
    });

    $(document).on('focusout', '.radio, .field-label', function(e) {
      //console.log('focus out!');
      $(this).parent().animate({opacity: 1},1000);
    });
}

focus();