用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. Jmeter处理返回结果的值

    接口测试中,获取返回结果的值可以用插件JSON Path Extractor 此插件可以直接处理json,通过key来取值. 该插件下载地址为:http://jmeter-plugins.org/wi ...

  2. Python函数定义、文件操作(读写、修改)

    date:2018421 day3 一.函数定义 def  函数名(首字母大写) 增加程序可读性 #直接写函数名即可调用函数 #参数 ①.形参 ②.实参 ③.缺省参数 如果有默认值,调用的时候没有传递 ...

  3. ecmall 学习记录

    1. /* 载入配置项 */ $setting =& af(MODULE); Conf::load($setting->getAll()); af方法定义如下: /** * 获取数组文件 ...

  4. CoAP、MQTT、RESTful协议区别

    /********************************************************************** * CoAP.MQTT.RESTful协议区别 * 说明 ...

  5. 使用try和catch捕获异常

    Java程序在执行过程中如果出现异常,会自动生成一个异常对象,该异常对象将被自动提交给JVM,当JVM接收到异常对象时,会寻找能处理这一异常的代码,并把当前异常对象交给其处理,这一过程称为捕获(cat ...

  6. 2分钟理解文件IO -我对文件IO的理解与实验对比

    本文介绍了不同的IO方式以及他们之间的效率比较 1.一次读取写入单个字节(读取400M的文件浪费了很久,等了很久没读取完成,证明其效率很差) public class CopyFileDemo { p ...

  7. CIFAR-10数据集读取

    参考:https://jingyan.baidu.com/article/656db9183296c7e381249cf4.html 1.使用读取方式pickle def unpickle(file) ...

  8. String引用数据类型

    一.String类的第一种方式 (原文地址:https://blog.csdn.net/wangdajiao/article/details/52087302)1.直接赋值 例:String str ...

  9. java:try...catch...finally

    try...catch...finally 规则: 可以没有 finally 块 如果没有 catch 块,则必须跟一个 finally 块 当在 try 块或 catch 块中遇到 return 语 ...

  10. MySQL Point in Time Recovery the Right Way

    In this blog, I’ll look at how to do MySQL point in time recovery (PITR) correctly. Sometimes we nee ...