Question

基本上在大多数其他浏览器中，当关注dropkick菜单时，它会关闭。或者在选择另一个dropkick菜单时，上一个/另一个打开菜单会自动关闭。

然而，在Chrome中，这不会发生。您可以打开它们并关闭它们，您必须选择一些内容或再次单击它。

有什么想法吗？

谢谢！

Answer 1

我，改变它所在的代码：

  // Focus events
      $dk.bind('focus.dropkick', function (e) {
        $dk.addClass('dk_focus');
      }).bind('blur.dropkick', function (e) {
        $dk.removeClass('dk_open dk_focus');
      });

把：

if($.browser.webkit) {

      $('html').click(function() {
          $dk.removeClass('dk_open dk_focus');

    });
      $dk.click(function(event){
          $dk.addClass('dk_focus');

      });


  }else{

      // Focus events
      $dk.live('focus', function() {
          $dk.addClass('dk_focus');
      }).live('blur', function() {
           $dk.removeClass('dk_open dk_focus');
      });
  }

它会正常工作。

Answer 2

我遇到了同样的问题，我的一位朋友发现，如果你将“tabindex”属性添加到“select”标签，dropkick就会表现得很好。

这不起作用：

<select name="test">
<option val="1">a</option>
</select>

这将有效：

<select name="test" tabindex="1">
<option val="1">a</option>
</select>

Answer 3

在webkit浏览器中为网络和移动设备发起了很多与Dropkick有关的问题。

以下是完整的代码，在dropkick中找到以下代码

// Focus events $dk.bind('focus.dropkick', function (e) { $dk.addClass('dk_focus'); }).bind('blur.dropkick', function (e) { $dk.removeClass('dk_open dk_focus'); });

并将其替换为以下

// Focus events
        if($.browser.webkit) {

              $('html').click(function() {
                  $dk.removeClass('dk_open dk_focus');

            });

          $dk.click(function(event){
                  $dk.addClass('dk_focus');

              });
              $('.dk_toggle').click(function(){
                var elements__ = $(this).parent('div');
                    if(elements__.hasClass('dk_open')){
                        _closeDropdown($dk); 
                        return false;
                    }
            });



          }
          else{

              // Focus events
              $dk.live('focus', function() {
                  $dk.addClass('dk_focus');
              }).live('blur', function() {
                   $dk.removeClass('dk_open dk_focus');
              });
          }

快乐编码!!

Answer 4

这是我发现的一个更简单的解决方案，由https://github.com/JamieLottering/DropKick/issues/45

提供

您只需要在.dk_toggle的“实时”“点击”事件中添加一行代码（在大多数版本中从第363行开始）：

$('.dk_open').removeClass('dk_open');

最后的方法是：

// Handle click events on the dropdown toggler
$('.dk_toggle').live('click', function (e) {
    $('.dk_open').removeClass('dk_open');
    var $dk  = $(this).parents('.dk_container').first();
    _openDropdown($dk);
    if ("ontouchstart" in window) {
    $dk.addClass('dk_touch');
    $dk.find('.dk_options_inner').addClass('scrollable vertical');
    }
  e.preventDefault();
  return false;
});

Chrome中的jQuery Dropkick：下拉菜单不会自动关闭

4 个答案: