用modal来show一个对话框

dialog.modal({
backdrop:true,
keyboard:true,
show:true
});
  • 1
  • 2
  • 3
  • 4
  • 5

然后再modal中初始化select2

dialog.find("select").select2({
formatNoMatches: function() {
return "没有选项";
},
placeholder: "请选择...",
minimumResultsForSearch: 0,
allowClear: false
});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

这时候select2的搜索框无法输入,一般有两方面的原因 
1.检查下modal的div中是否有tabindex=”-1”,这个属性

<div class="modal fade in" id="dialog-new-draft">
  • 1

2.js代码中加入

$.fn.modal.Constructor.prototype.enforceFocus = function () {};
  • 1

满足这两个一般就没问题了。

在BootStrap的modal中使用Select2搜索框无法输入的更多相关文章

  1. Bootstrap3 模态框 select2搜索框无法输入

    <div class="modal fade" role="dialog" aria-hidden="true" data-backd ...

  2. 在BootStrap的modal中使用Select2

      bootstrap 3 $.fn.modal.Constructor.prototype.enforceFocus = function() {}; bootstrap4 $.fn.modal.C ...

  3. Bootstrap 模态框 select2搜索框无法输入

    去掉模态框的div中的 tabindex="-1" 这个属性 <div class="modal fade" role="dialog" ...

  4. 解决select2在bootstrap的modal中默认不显示的问题

    在Bootstrap中的Modal,select2插件会有不显示,因为其z-index小于modal,还有另外一个问题是,修正z-index之后,select2不会自动失去焦点的问题.代码解决如下: ...

  5. select2的搜索框不能输入搜索内容

    按照select2官网配置完后,搜索框弹出后无法输入内容,究竟怎么回事,于是在其他页面尝试了select2,发现可以啊,为什么在这个地方不可以,终于找到了造成这个问题的不同之处:select2在模态对 ...

  6. select2搜索框查询加遍历

    <div class="form-group"> <label class="control-label col-sm-1 no-padding-rig ...

  7. 解决 Ant Design Modal 中的 Select 选项框不能显示的问题

    antd 的 select 在 modal 里不能显示候选框 代码示例 <a-modal> <a-select> <!-- options --> </a-s ...

  8. BootStrap 的modal 中使用typeahead

    刚开始怎么也不现实,在页面上显示正常. 调试发现是下拉框被modal遮挡住了, 找到样式dropdown-menu    修改z-index值为2000后,显示正常.(modal的z-index值为1 ...

  9. bootstrap --- 在 modal中的 datetimepicker 关闭 ,会造成 modal也会被关闭.

    这个大概是事件冒泡造成的. 解决办法: <form id="userForm" class="form-horizontal"> <input ...

随机推荐

  1. nginx搭建以及其配置文件

    nginx搭建: 参考link:https://blog.csdn.net/wxyjuly/article/details/79443432 nginx配置文件详解: 参考link:https://w ...

  2. C语言实现Winsocket网络传输数据时乱码问题

    问题描述:输入中文字符时在数据结尾总是有别的字符冒出 解决办法: recvBuf[ret] = '\0';//接收数据的数组,表示存储的数据截止,后面没有数据了 再运行,传输正常. 提示:C语言基础知 ...

  3. powerdesigner(数据设计工具)

    https://jingyan.baidu.com/album/4f7d57120468c91a2019279f.html?picindex=1  (摘抄 原网地址)

  4. centos 解决中文支持问题, 如此修改可以修正eclipse 乱码问题。

    一.中文支持 安装中文语言包: yum groupinstall chinese-support 修改字符编码配置,没有这个文件就创建它: vim /etc/sysconfig/i18n 为 LANG ...

  5. Jmeter的察看结果树 出现乱码的解决方法

    在apache-jmeter-3.0\bin目录下, 用Notepad工具打开jmeter.properties文件 在文件中搜索encoding,可以搜素到1030行: #sampleresult. ...

  6. binary and out mode to open a file

    When I use binary and out mode to open a exist file, and to modify the 4th and 8th byte data to 0x78 ...

  7. es6学习日记2

    1.字符串扩展 字符串的遍历器接口 for (let codePoint of 'foo') { console.log(codePoint) } // "f" // " ...

  8. Session & Cookie小知识~

    Cookie 一个HTTP cookie的(也称为网络Cookie,互联网的cookie,浏览器cookie,或者干脆饼干)是一小块从发送的数据的网站用户的并存储在用户的计算机上的网页浏览器,而用户浏 ...

  9. GAN 教程记录

    目标:使G产生的分布sample出来接近D的分布 1.G产生的data是否是database中的图片 a.计算L1 L2相似度 2.GAN与其他生成器相比较,能够生成较为清晰的图片 3.一次itera ...

  10. https://blog.csdn.net/doegoo/article/details/50749817

    因为使用DiscuzX3.2进行系统的整合后,因为只是想在原J2EE的系统上增加论坛功能,而且J2EE中已经有一套用户的注册认证的体系,所以不需要在Discuz的系统中去注册以及登录功能,而是通过在J ...