只能用chrome调试查看元素,看看input具体位置 按F12
<select id ="queryDevice"class="selectpicker" data-live-search="true">
<option data-tokens="ketchup mustard">查询设备</option>
<option data-tokens="mustard">设备一</option>
<option data-tokens="frosting">设备二</option>
</select>
还有点,必须下拉框展开时候才会生成输入框,所以要在下拉框全部展开之后,再查找input 元素
查找思路,以select标签作为相对定位,它上一个元素div,找div之后,查询div子元素input标签
2、绑定事件
首先绑定bootstrap-select事件
代码如下:
$("#queryDevice").on('shown.bs.select',function(e){
console.log('展开之后');
$('#queryDevice').prev().find("input").keydown(function(){
$('#queryDevice').prev().find("input").attr('id',"deviceInput"); //为input增加id属性
console.log($('#deviceInput').val()); //获取输入框值输出到控制台
})
关键就是
$('#queryDevice').prev().find("input")
:查找input元素(prev()表示当前元素的前一个元素)
如果其它事件只需修改绑定事件的类型。
概述:需要bootstrap-select绑定按键事件如果绑定一个元素?找到该元素(这是关键)绑定事件1、找到input元素只能用chrome调试查看元素,看看input具体位置 按F12 查询设备 设备一 设备二还有点,必须下拉框展开时候才会生成输入框,所以要在下拉框全部展开之后,再查找input 元素查找思路,以s
$orgid.on('shown.bs.
select
',function(e){
//为input
绑定
事件
$orgid.prev().find("input").keyup(function(){
//为input增加id属性,见下方截图
bootStrap
模态框与
select
2合用时input不能获取焦点
在
bootstrap
的模态框里使用
select
2插件,会导致
select
2里的input
输入框
没有办法获得焦点,没有办法输入.
把页面中的 tabindex="-1" 删掉(测试成功)
<div id="myModal" class="modal hide fade" tabindex="-1" role="dia...
{"visible":true,"field":"remarks","title":"备注","formatter":function(value, row, index, field) {
if(value === 'undefined' || value =='null' || value ==null){
value=''
// 专线
if(row.ls == "2"){
return '<input .
bootstrap
-
select
多选传递到后台以及后台传递到前台
绑定
bootstrap
-
select
介绍
bootstrap
-
select
多选传递数据到后台
bootstrap
-
select
多选后台传递数据到前台
绑定
bootstrap
-
select
介绍
bootstrap
-
select
是最近常用的简洁方便的
下拉
列表,开源地址:https://github.com/silviomoreto/boots...
<link href="/
bootstrap
-
select
-1.12.4/dist/css/
bootstrap
-
select
.min.css" rel="stylesheet" />
<script src="/
bootstrap
-
select
-1.12.4/dist/js/
bootstrap
-
select
.min.js"></script>
下载地址:https://developer.snapappointments.com/
bootstrap
-
select
/
示例地址:https://developer.snapappointments.com/
bootstrap
-
select
/examples/
参数详解地址:https://developer.snapappointments.com/
bootstrap
-
select
/op...
你可以使用 `data-dropup-auto` 属性来控制 `
bootstrap
-
select
` 组件
下拉
弹出位置。该属性默认值为 `true`,即自动判断
下拉
弹出位置,如果空间不足会自动向上弹出,否则向下弹出。如果你想要固定
下拉
弹出位置,可以将该属性设置为 `false`,然后使用 `data-dropup` 属性设置弹出位置。例如:
```html
<
select
class="
select
picker" data-dropup-auto="false" data-dropup="true">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<option>Option 4</option>
<option>Option 5</option>
<option>Option 6</option>
<option>Option 7</option>
<option>Option 8</option>
<option>Option 9</option>
<option>Option 10</option>
</
select
>
在上面的例子中,`data-dropup-auto` 属性被设置为 `false`,表示不自动判断
下拉
弹出位置。`data-dropup` 属性被设置为 `true`,表示强制向上弹出。你可以根据需要设置 `data-dropup` 属性的值为 `true` 或 `false`。