jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jquery – 在弹出窗口中选择2:搜索输入无法聚焦大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用SELEct2 jquery插件和magnific弹出窗口.如果我在打开的弹出窗口中单击选择,则会显示包含某些结果的搜索框.问题是无法在搜索框中输入任何内容 – 光标就不会出现.这是jsfiddle,它演示了问题 http://jsfiddle.net/clime/qweWa/15/.代码如下:

# html
<a href="#test-popup" class="open-popup-link">Show inline popup</a>

<div id="test-popup" class="white-popup mfp-hide">
    <SELEct id="focus-blur-loop-SELEct">
        <option>Hello</option>
        <option>world</option>
    </SELEct>
</div>

# js
$(function() {
  $('.open-popup-link').magnificPopup({
    type:'inline',midClick: true
  });

  $('#focus-blur-loop-SELEct').SELEct2({
      width: '200px'
  });
});

# css
.white-popup {
  position: relative;
  BACkground: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
}

我已经完成了一些基础研究,并且我发现下面的两个回调被称为unfinetly.事件中似乎存在一些无限循环.@H_489_10@

// SELEct2.js:742
search.on("focus",function () { search.addClass("SELEct2-focused"); });
search.on("blur",function () { search.removeClass("SELEct2-focused");});

解决方法

答案在这里https://github.com/dimsemenov/Magnific-Popup/issues/280.问题是由弹出元素中的SELEct2输入引起的.它可以通过覆盖弹出的_onFocusIn方法来修复:

$.magnificPopup.instance._onFocusIn = function(E) {
    // Do nothing if target element is SELEct2 input
    if( $(e.target).hasClass('SELEct2-input') ) {
       return true;
    } 
    // Else call parent method
    $.magnificPopup.proto._onFocusIn.call(this,E);
}

大佬总结

以上是大佬教程为你收集整理的jquery – 在弹出窗口中选择2:搜索输入无法聚焦全部内容,希望文章能够帮你解决jquery – 在弹出窗口中选择2:搜索输入无法聚焦所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。