jquery - <legend> 不会收到 :focus event?

Question

这是 HTML:

              <fieldset>
                <legend>FieldsetName</legend>
                <div></div>
              </fieldset>

这是 CSS:

legend:focus {
  background-color: #ffddbe;
  outline: none; 
}
legend.focusin {
  background-color: #ffddbe;
  outline: none; 
}

点击它不会执行任何操作。

好吧，我想，我会选择 jQuery。

$('legend').focusin( function() {
    $(this).addClass('focusin');
    });

$('legend').focusout( function() {
    $(this).removeClass('focusin');
});

这也无济于事。 但是，如果 $('legend') 监听“click”，它就会执行它应该执行的操作。给了什么？

Answer 1

不确定它是否是正确的修复，但添加 tabIndex 修复它

<legend tabIndex="1">FieldsetName</legend>

演示:Fiddle