添加链接
link管理
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接

只能用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`。