大佬教程收集整理的这篇文章主要介绍了javascript – Bootstrap table-striped不会改变颜色，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我有下表(注意：这是由inspect元素抓取的HTML,我不知道为什么style =“BACkground-color：rgb(255,255,255);是吗…)：
@H_450_4@<table class="table table-Striped table-condensed" id="instance-table"> <thead> <tr id="checkrow"> <th><input type="checkbox" id="checkall"></th> <th>column A</th> <th>column A</th> <th>column A</th> </tr> </thead> <tbody id="instanceInnerContent"> <tr style="BACkground-color: rgb(255,255);"> <td class="act"><input type="checkbox"></td> <td>Value 1</td> <td>Value 2</td> </tr> <tr style="BACkground-color: rgb(255,255);"> <td class="act"><input type="checkbox"></td> <td>Value 1</td> <td>Value 2</td> </tr> </tbody> </table>并使用以下代码选择行或选择所有行或选择行单击：
@H_450_4@// if user clicks on checkbox with id="checkall" - all checkboxes are SELEcted // and table row BACkground is highlighted $('body').on('click','#checkall',function () { $('input:checkbox:not(#checkall)').prop('checked',this.checked); if ($(this).is(':checked') == truE) { $("#instance-table").find('tr:not(#checkrow)').css("BACkground-color","#ccc"); //$('#instance-action').removeAttr('disabled'); } else { $("#instance-table").find('tr:not(#checkrow)').css("BACkground-color","#fff"); //$('#instance-action').attr('disabled','disabled'); } }); // if user clicks on checkbox,diffrent than checkbox with id="checkall",// then checkbox is checked/unchecked $('body').on('click','input:checkbox:not(#checkall)',function () { if($("#checkall").is(':checked') == true && this.checked == falsE) { $("#checkall").prop('checked',falsE); $(this).closest('tr').css("BACkground-color","#ffffff"); } if(this.checked == truE) { $(this).closest('tr').css("BACkground-color","#ccc"); //$('#instance-action').removeAttr('disabled'); // function to check/uncheck checkbox with id="checkbox" checkSELEctAll(); } if(this.checked == falsE) { $(this).closest('tr').css("BACkground-color","#ffffff"); //$('#instance-action').attr('disabled','disabled'); } }); // if user clicks,someware on table row,checkbox is checked/unchecked // and table row BACkground is highlighted or not $('body').on('click','#instance-table tbody tr',function () { var this_row = $(this); var checkbox = this_row.find('input:checkbox'); if (event.target.type !== 'checkbox') { if ( checkbox.is(':checked') == false ) { checkbox.prop('checked',truE); this_row.css("BACkground-color","#ccc"); //$('#instance-action').removeAttr('disabled'); checkSELEctAll(); } else { checkbox.prop('checked',falsE); this_row.css("BACkground-color","#fff"); //$('#instance-action').attr('disabled','disabled'); checkSELEctAll(); } } }); function checkSELEctAll() { var flag = true; $('input:checkbox:not(#checkall)').each(function() { if(this.checked == falsE) flag = false; //console.log(flag); }); $("#checkall").attr('checked',flag); }但不知怎的,条纹表行没有突出显示,怎么样？
虽然代码已经在这里,但我还有一个问题,即如果我手动检查每一行,它不会检查checkall复选框.当我手动检查checkall复选框时,取消选中每个复选框,然后再次手动检查每一行.我找不到错误.
CSS：
@H_450_4@.SELEcted { BACkground-color: #ddd !important; }码：
注意：代码是函数的一部分,它检查是否单击了行的第一个td内的复选框.
@H_450_4@$(this).parent().parent().children('td').each(function() { $(this).addClass("SELEcted"); });它可能不是一个简洁的解决方案,但它的工作:)
以上是大佬教程为你收集整理的javascript – Bootstrap table-striped不会改变颜色全部内容，希望文章能够帮你解决javascript – Bootstrap table-striped不会改变颜色所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。