先上截图,第234行都是禁用状态,但是只有第2行显示了禁用开关,后面的都没有开关初始化

检查下代码:

onLoadSuccess: function(data){
{#获取行数据的状态#}
console.log('渲染数据完成后,打印所有数据')
console.log(data); var data=$("#mytab").bootstrapTable("getData");
console.log('已获取全部数据%s',data); for (var i=0;i<data.length;i++){
console.log(data[i].project_code,data[i].status)
if (data[i].status == 1){
console.log('这个是开启的')
$('#project_status_switch_on').bootstrapSwitch({
onText: "启用",      // 设置ON文本  
offText: "禁用",    // 设置OFF文本  
onColor: "success",// 设置ON文本颜色(info/success/warning/danger/primary)  
offColor: "danger",  // 设置OFF文本颜色 (info/success/warning/danger/primary)  
size: "small",    // 设置控件大小,从小到大  (mini/small/normal/large)
}).bootstrapSwitch('state',true)
}else{
console.log('这个是禁用的')
$('#project_status_switch_off').bootstrapSwitch({
onText: "启用",      // 设置ON文本  
offText: "禁用",    // 设置OFF文本  
onColor: "success",// 设置ON文本颜色(info/success/warning/danger/primary)  
offColor: "danger",  // 设置OFF文本颜色 (info/success/warning/danger/primary)  
size: "small",    // 设置控件大小,从小到大  (mini/small/normal/large)
}).bootstrapSwitch('state',false)
}
}
}

发现代码:$('#project_status_switch_off').bootstrapSwitch(),是按照id=project_status_switch_off来渲染的,只要是有这个属性的input框应该都能渲染才对啊。F12检查下没问题确实是这个属性值,那为什么不能渲染呢?

将渲染开关定位元素方式修改为:$("[id='project_status_switch_off']").bootstrapSwitch()

完美解决。

后续分析:可能$('#project_status_switch_off')方式只能找到第一个匹配的元素,而$("[id='project_status_switch_off']")方式会将所有符合条件的元素全部匹配。

bootstrap-switch:记一次很坑的问题(连续相同状态的多行数据只有第一个显示按钮,其他行没有开关初始化)的更多相关文章

  1. 记一次很坑的python2与python3共存问题

    当添加PYTHONPATH环境变量时,无论输入pip2 -V还是pip3 -V都显示的是python2的环境变量,使用pip3 install 时也是安装在了python2的三方库(因为python2 ...

  2. bootstrap switch功能

    bootstrap switch是一个按钮开关,点击时获取其状态可通过以下代码: <input id="email_switch_state" type="chec ...

  3. bootstrap switch样式修改与多列等间距布局

    先以一张图开启今天的随笔 今天实习遇到了switch按钮,小姐姐说用插件bootstrap switch来写,我第一次用这个插件,首先在引入方面就遇到了很多坑,先来总结一下bootstrap swit ...

  4. 前端插件之Bootstrap Switch 选择框开关控制

    简介 Bootstrap Switch是一款轻量级插件,可以给选择框设置类似于开关的样式 它是依赖于Bootstrap的一款插件 下载 下载地址 在线引用 导入 因为它是依赖于Bootstrap的一款 ...

  5. 前端基础(十):Bootstrap Switch 选择框开关控制

    简介 Bootstrap Switch是一款轻量级插件,可以给选择框设置类似于开关的样式 它是依赖于Bootstrap的一款插件 下载 下载地址 在线引用 导入 因为它是依赖于Bootstrap的一款 ...

  6. JS流程控制语句 多种选择(Switch语句) 当有很多种选项的时候,switch比if else使用更方便。

    多种选择(Switch语句) 当有很多种选项的时候,switch比if else使用更方便. 语法: switch(表达式) { case值1: 执行代码块 1 break; case值2: 执行代码 ...

  7. 在Bootstrap开发框架中使用dataTable直接录入表格行数据(2)--- 控件数据源绑定

    在前面随笔<在Bootstrap开发框架中使用dataTable直接录入表格行数据>中介绍了在Web页面中使用Jquery DataTable插件进行对数据直接录入操作,这种处理能够给用户 ...

  8. 使用Ajax+jQuery来实现前端收到的数据在console上显示+简单的主页设计与bootstrap插件实现图片轮播

    1.实现前端输入的数据在console上显示 上一篇是解决了在前端的输入信息在cygwin上显示,这次要给前台们能看见的数据,因为数据库里插入的数据少,所以写的语句翻来覆去就那几个词,emmm···当 ...

  9. 在Bootstrap开发框架中使用dataTable直接录入表格行数据

    在Winform开发的时候,我们很多时候可以利用表格控件来直接录入数据,不过在Web上较少看到,其实也可以利用dataTable对象处理直接录入表格行数据,这个可以提高数据的录入方便,特别是在一些简单 ...

随机推荐

  1. 替罪羊树 ------ luogu P3369 【模板】普通平衡树(Treap/SBT)

    二次联通门 : luogu P3369 [模板]普通平衡树(Treap/SBT) 闲的没事,把各种平衡树都写写 比较比较... 下面是替罪羊树 #include <cstdio> #inc ...

  2. 推荐VSCode多语言开发,支持一键JAVA

    本文梯子 缘起 一.VSCode 开发 NetCore 0.安装 VSCode IDE 1.安装依赖扩展 2.新建一个项目 3.打开已有工程 4.总结 二.VSCode 开发 Vue 1.安装插件 2 ...

  3. CAN信号转以太网究竟怎么回事?TCP转CAN又是什么?

    首先说说can总线. can总线是目前工业控制领域应用最广的现场总线,它可以实现远距离信息的传输,是各种设备和各类功能部件之间传送信息的公用通道,它是由导线组成的传输线束,用于连接体统中的各个节点,传 ...

  4. PHP-FPM远程代码执行漏洞(CVE-2019-11043)

    0x00 简介 在长亭科技举办的 Real World CTF 中,国外安全研究员 Andrew Danau 在解决一道 CTF 题目时发现,向目标服务器 URL 发送 %0a 符号时,服务返回异常, ...

  5. 【洛谷】P3518 [POI2011]SEJ-Strongbox

    题目描述 有一个密码箱,0到n-1中的某些整数是它的密码. 且满足,如果a和b都是它的密码,那么(a+b)%n也是它的密码(a,b可以相等) 某人试了k次密码,前k-1次都失败了,最后一次成功了. 问 ...

  6. 怎么样在vue-cli的项目里面引入element ui

    第一步:先进入到项目里面 npm i element-ui -S 第二步: import Vue from 'vue'; import ElementUI from 'element-ui'; //这 ...

  7. Redis 3.2.100 配置注意

    新装服务器外网连接报错 /Interactive, Initializing/NotStarted, last: NONE, origin: BeginConnectAsync, outstandin ...

  8. ubuntu之路——day11.4 定位数据不匹配与人工合成数据

    1.人工检验train和dev/test之间的区别: 比如:汽车语音识别中的噪音.地名难以识别等等 2.使得你的训练集更靠近(相似于)dev/test,收集更多类似于dev的数据: 比如:dev中存在 ...

  9. 咏南中间件随LINUX开机自动启动

    咏南中间件随LINUX开机自动启动 LINUX DEAMON,LINUX也有类似WINDOWS的服务. program ynCrossServer; {$HINTS OFF} {$APPTYPE CO ...

  10. Workstation 14 Returns EFI Network Start PXE over IPv4 When Installing New Win10 Guest O/S

    当启动出现“Click any key to boot from DVD”时候,需要键盘点击一下,即可解决. 参考:https://communities.vmware.com/thread/5730 ...