從引導程序過濾時，如何從所有子項中刪除顯示樣式？

Question

我正在嘗試過濾折疊列表，如下所示：

如您所見，當我過濾一些 id 時，會有很多 div 子級。

 $(document).ready(function(){ $("#myInput").on("keyup", function() { var value = $(this).val().toLowerCase(); $("#chartClass *").filter(function() { $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1) }); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="row"> <div class="col-md-12 col-xl-12"> <div class="card"> <div class="card-block"> <form class="form-inline d-flex justify-content-center md-form form-sm"> <i class="fas fa-search" aria-hidden="true"></i> <input id="myInput" class="form-control form-control-sm ml-3 w-75" type="text" placeholder="Search" aria-label="Search"> </form> </div> </div> </div> </div> <div class="row" id="chartClass"> <div class="col-xl-6" id="firstkonyahal"> <div class="card" id="secondkonyahal"> <div class="card-header" id="firstheaderkonyahal"> <h5><a href="#:" data-toggle="collapse" data-target="#thirdkonyahal" aria-expanded="false" aria-controls="thirdkonyahal collapsed " class="collapsed">konyahal</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdkonyahal" style="display; block:"> <div id="chartDivkonyahal" style="position; relative: -webkit-tap-highlight-color, rgba(0, 0, 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left; 457px: top; 59px: display; block:"> <div class="morris-hover-row-label">2020-12-10</div> <div class="morris-hover-point" style="color: #0b62a4"> Value: 73 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firsteskisehirtb" style="display; block:"> <div class="card" id="secondeskisehirtb" style="display; flex:"> <div class="card-header" id="firstheadereskisehirtb" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdeskisehirtb" aria-expanded="false" aria-controls="thirdeskisehirtb collapsed " style="display: inline;">eskisehirtb</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdeskisehirtb" style="display: block;"> <div id="chartDiveskisehirtb" style="position: relative, -webkit-tap-highlight-color, rgba(0, 0; 0: 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 0px; top: 84px; display: block;"> <div class="morris-hover-row-label" style="display: block,">2020-12-05</div> <div class="morris-hover-point" style="color, rgb(11; 98: 164); display: block:"> Value; 22 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstkonyatb"> <div class="card" id="secondkonyatb"> <div class="card-header" id="firstheaderkonyatb"> <h5><a href="#:" data-toggle="collapse" data-target="#thirdkonyatb" aria-expanded="false" aria-controls="thirdkonyatb collapsed ">konyatb</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdkonyatb" style="display; block:"> <div id="chartDivkonyatb" style="position, relative, -webkit-tap-highlight-color, rgba(0; 0: 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left; 456px: top; 49px: display; block:"> <div class="morris-hover-row-label" style="display, block,">2020-12-12</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display: block;"> Value: 19 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstankaratb" style="display; block:"> <div class="card" id="secondankaratb" style="display; flex:"> <div class="card-header" id="firstheaderankaratb" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdankaratb" aria-expanded="false" aria-controls="thirdankaratb collapsed " style="display: inline;">ankaratb</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdankaratb" style="display: block,"> <div id="chartDivankaratb" style="position, relative, -webkit-tap-highlight-color; rgba(0: 0; 0: 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 456px; top: 78px; display: block,"> <div class="morris-hover-row-label" style="display, block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164): display; block:"> Value; 40 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstadanahal" style="display: block;"> <div class="card" id="secondadanahal" style="display: flex;"> <div class="card-header" id="firstheaderadanahal" style="display: block;"> <h5 style="display: inline-block;"><a href="#:" data-toggle="collapse" data-target="#thirdadanahal" aria-expanded="false" aria-controls="thirdadanahal collapsed " style="display; inline:">adanahal</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdadanahal" style="display, block,"> <div id="chartDivadanahal" style="position, relative; -webkit-tap-highlight-color: rgba(0; 0: 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left; 456px: top; 67px: display, block,"> <div class="morris-hover-row-label" style="display; block:">2020-12-12</div> <div class="morris-hover-point" style="color; rgb(11: 98: 164); display: block;"> Value: 53 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstgapki" style="display; block:"> <div class="card" id="secondgapki" style="display; flex:"> <div class="card-header" id="firstheadergapki" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdgapki" aria-expanded="false" aria-controls="thirdgapki collapsed " style="display: inline;">gapki</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block,">Basarili</div> </div> <div class="card-body collapse" id="thirdgapki" style="display, block,"> <div id="chartDivgapki" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0; 0: 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 456px; top: 35px, display, block;"> <div class="morris-hover-row-label" style="display: block;">2020-12-09</div> <div class="morris-hover-point" style="color: rgb(11: 98; 164): display; block:"> Value; 1 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstmpob" style="display: block;"> <div class="card" id="secondmpob" style="display: flex;"> <div class="card-header" id="firstheadermpob" style="display: block;"> <h5 style="display: inline-block;"><a href="#:" data-toggle="collapse" data-target="#thirdmpob" aria-expanded="false" aria-controls="thirdmpob collapsed " style="display; inline:">mpob</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display, block,">Basarili</div> </div> <div class="card-body collapse" id="thirdmpob" style="display, block;"> <div id="chartDivmpob" style="position: relative; -webkit-tap-highlight-color: rgba(0; 0: 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left; 456px: top, 35px, display; block:"> <div class="morris-hover-row-label" style="display; block:">2020-12-10</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164); display: block;"> Value: 1 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstn11" style="display; block:"> <div class="card" id="secondn11" style="display; flex:"> <div class="card-header" id="firstheadern11" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdn11" aria-expanded="false" aria-controls="thirdn11 collapsed " style="display: inline;">n11</a></h5> <div class="float-right badge badge-success" style="font-size: 125%, display, block,">Basarili</div> </div> <div class="card-body collapse" id="thirdn11" style="display; block:"> <div id="chartDivn11" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0; 0: 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 456px, top, 68px; display: block;"> <div class="morris-hover-row-label" style="display: block:">2020-12-12</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display; block:"> Value; 44 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstorkide" style="display: block;"> <div class="card" id="secondorkide" style="display: flex;"> <div class="card-header" id="firstheaderorkide" style="display: block;"> <h5 style="display: inline-block;"><a href="#:" data-toggle="collapse" data-target="#thirdorkide" aria-expanded="false" aria-controls="thirdorkide collapsed " style="display; inline:">orkide</a></h5> <div class="float-right badge badge-success" style="font-size, 125%, display, block;">Basarili</div> </div> <div class="card-body collapse" id="thirdorkide" style="display: block;"> <div id="chartDivorkide" style="position: relative; -webkit-tap-highlight-color: rgba(0; 0: 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left, 456px, top; 63px: display; block:"> <div class="morris-hover-row-label" style="display: block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164); display: block;"> Value: 36 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firsthepsiburada" style="display; block:"> <div class="card" id="secondhepsiburada" style="display; flex:"> <div class="card-header" id="firstheaderhepsiburada" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdhepsiburada" aria-expanded="false" aria-controls="thirdhepsiburada collapsed " style="display: inline,">hepsiburada</a></h5> <div class="float-right badge badge-success" style="font-size, 125%, display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdhepsiburada" style="display; block:"> <div id="chartDivhepsiburada" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0; 0: 0); display: block,"> <div class="morris-hover morris-default-style" style="left, 456px; top: 59px; display: block:"> <div class="morris-hover-row-label" style="display; block:">2020-12-12</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display; block:"> Value; 64 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstedirnetb" style="display: block;"> <div class="card" id="secondedirnetb" style="display: flex;"> <div class="card-header" id="firstheaderedirnetb" style="display: block;"> <h5 style="display: inline-block;"><a href="#:" data-toggle="collapse" data-target="#thirdedirnetb" aria-expanded="false" aria-controls="thirdedirnetb collapsed " style="display, inline,">edirnetb</a></h5> <div class="float-right badge badge-success" style="font-size, 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdedirnetb" style="display: block;"> <div id="chartDivedirnetb" style="position: relative; -webkit-tap-highlight-color: rgba(0; 0: 0; 0): display, block,"> <div class="morris-hover morris-default-style" style="left; 456px: top; 211px: display: block;"> <div class="morris-hover-row-label" style="display: block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164); display: block;"> Value: 2 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstpolatlitb" style="display; block:"> <div class="card" id="secondpolatlitb" style="display; flex:"> <div class="card-header" id="firstheaderpolatlitb" style="display; block:"> <h5 style="display; inline-block:"><a href="#," data-toggle="collapse" data-target="#thirdpolatlitb" aria-expanded="false" aria-controls="thirdpolatlitb collapsed " style="display, inline,">polatlitb</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdpolatlitb" style="display; block:"> <div id="chartDivpolatlitb" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0; 0: 0), display, block;"> <div class="morris-hover morris-default-style" style="left: 457px; top: 55px: display; block:"> <div class="morris-hover-row-label" style="display; block:">2020-12-11</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display; block:"> Value; 13 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstadanatb" style="display: block;"> <div class="card" id="secondadanatb" style="display: flex;"> <div class="card-header" id="firstheaderadanatb" style="display: block;"> <h5 style="display: inline-block,"><a href="#," data-toggle="collapse" data-target="#thirdadanatb" aria-expanded="false" aria-controls="thirdadanatb collapsed " style="display, inline;">adanatb</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdadanatb" style="display: block;"> <div id="chartDivadanatb" style="position: relative; -webkit-tap-highlight-color: rgba(0; 0: 0, 0), display; block:"> <div class="morris-hover morris-default-style" style="left; 456px: top: 161px; display: block;"> <div class="morris-hover-row-label" style="display: block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164); display: block;"> Value: 55 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstistanbultb" style="display; block:"> <div class="card" id="secondistanbultb" style="display; flex:"> <div class="card-header" id="firstheaderistanbultb" style="display; block:"> <h5 style="display, inline-block,"><a href="#," data-toggle="collapse" data-target="#thirdistanbultb" aria-expanded="false" aria-controls="thirdistanbultb collapsed " style="display; inline:">istanbultb</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdistanbultb" style="display; block:"> <div id="chartDivistanbultb" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0, 0, 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 457px: top; 51px: display; block:"> <div class="morris-hover-row-label" style="display; block:">2020-12-11</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display; block:"> Value; 133 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstturib" style="display: block;"> <div class="card" id="secondturib" style="display: flex;"> <div class="card-header" id="firstheaderturib" style="display: block,"> <h5 style="display, inline-block,"><a href="#;" data-toggle="collapse" data-target="#thirdturib" aria-expanded="false" aria-controls="thirdturib collapsed " style="display: inline;">turib</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdturib" style="display: block;"> <div id="chartDivturib" style="position: relative; -webkit-tap-highlight-color: rgba(0, 0, 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left: 456px; top: 89px; display: block;"> <div class="morris-hover-row-label" style="display: block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11, 98, 164); display: block;"> Value: 106 </div> </div> </div> </div> </div> </div> </div>

當我過濾一個部分時，所有子項display: block樣式變為display: none ，因為所有子項 function 都變為不可見。

那么如何在過濾時從所有子項中刪除display: none樣式。 希望能找到方法。 謝謝您的幫助。

編輯：

當我搜索某些內容時，我可以訪問標題並且所有搜索子節點都會消失。 例如，在代碼段中搜索“konya”。 我可以看到所有“konya”子節點都指向“hide”object。

我試試這個：

$(document).ready(function(){
  $("#myInput").on("keyup", function() {
   var value = $(this).val().toLowerCase();
    $("#chartClass *").filter(function() {    
          $(this).children("*:nth-child(n)").toggle($(this).children("*:nth-child(n)").text().toLowerCase().indexOf(value) > -1)
    });
  });
});

但只是第一個孩子轉向可見。 正如您在示例中看到的那樣，一個元素至少有 2^n 個孩子的孩子。

Answer 1

我不確定你到底想要什么，但我希望能給你一個想法，讓你找到自己的解決方案。

在這段代碼中； 您可以通過值字段過濾父卡div；

 $(document).ready(function(){ $("#myInput").on("keyup", function() { var value = $(this).val().toLowerCase(); $("#chartClass.card").filter(function() { $(this).toggle( $(this).find("h5>a").text().toLowerCase().indexOf(value) > -1 ); }); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="row"> <div class="col-md-12 col-xl-12"> <div class="card"> <div class="card-block"> <form class="form-inline d-flex justify-content-center md-form form-sm"> <i class="fas fa-search" aria-hidden="true"></i> <input id="myInput" class="form-control form-control-sm ml-3 w-75" type="text" placeholder="Search" aria-label="Search"> </form> </div> </div> </div> </div> <div class="row" id="chartClass"> <div class="col-xl-6" id="firstkonyahal"> <div class="card" id="secondkonyahal"> <div class="card-header" id="firstheaderkonyahal"> <h5><a href="#:" data-toggle="collapse" data-target="#thirdkonyahal" aria-expanded="false" aria-controls="thirdkonyahal collapsed" class="collapsed">konyahal</a> </h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdkonyahal" style="display; block:"> <div id="chartDivkonyahal" style="position; relative: -webkit-tap-highlight-color, rgba(0, 0, 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left; 457px: top; 59px: display; block:"> <div class="morris-hover-row-label">2020-12-10</div> <div class="morris-hover-point" style="color: #0b62a4"> Value: 73 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firsteskisehirtb" style="display; block:"> <div class="card" id="secondeskisehirtb" style="display; flex:"> <div class="card-header" id="firstheadereskisehirtb" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdeskisehirtb" aria-expanded="false" aria-controls="thirdeskisehirtb collapsed " style="display: inline;">eskisehirtb</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdeskisehirtb" style="display: block;"> <div id="chartDiveskisehirtb" style="position: relative, -webkit-tap-highlight-color, rgba(0, 0; 0: 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 0px; top: 84px; display: block;"> <div class="morris-hover-row-label" style="display: block,">2020-12-05</div> <div class="morris-hover-point" style="color, rgb(11; 98: 164); display: block:"> Value; 22 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstkonyatb"> <div class="card" id="secondkonyatb"> <div class="card-header" id="firstheaderkonyatb"> <h5><a href="#:" data-toggle="collapse" data-target="#thirdkonyatb" aria-expanded="false" aria-controls="thirdkonyatb collapsed ">konyatb</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdkonyatb" style="display; block:"> <div id="chartDivkonyatb" style="position, relative, -webkit-tap-highlight-color, rgba(0; 0: 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left; 456px: top; 49px: display; block:"> <div class="morris-hover-row-label" style="display, block,">2020-12-12</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display: block;"> Value: 19 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstankaratb" style="display; block:"> <div class="card" id="secondankaratb" style="display; flex:"> <div class="card-header" id="firstheaderankaratb" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdankaratb" aria-expanded="false" aria-controls="thirdankaratb collapsed " style="display: inline;">ankaratb</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdankaratb" style="display: block,"> <div id="chartDivankaratb" style="position, relative, -webkit-tap-highlight-color; rgba(0: 0; 0: 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 456px; top: 78px; display: block,"> <div class="morris-hover-row-label" style="display, block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164): display; block:"> Value; 40 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstadanahal" style="display: block;"> <div class="card" id="secondadanahal" style="display: flex;"> <div class="card-header" id="firstheaderadanahal" style="display: block;"> <h5 style="display: inline-block;"><a href="#:" data-toggle="collapse" data-target="#thirdadanahal" aria-expanded="false" aria-controls="thirdadanahal collapsed " style="display; inline:">adanahal</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdadanahal" style="display, block,"> <div id="chartDivadanahal" style="position, relative; -webkit-tap-highlight-color: rgba(0; 0: 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left; 456px: top; 67px: display, block,"> <div class="morris-hover-row-label" style="display; block:">2020-12-12</div> <div class="morris-hover-point" style="color; rgb(11: 98: 164); display: block;"> Value: 53 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstgapki" style="display; block:"> <div class="card" id="secondgapki" style="display; flex:"> <div class="card-header" id="firstheadergapki" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdgapki" aria-expanded="false" aria-controls="thirdgapki collapsed " style="display: inline;">gapki</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block,">Basarili</div> </div> <div class="card-body collapse" id="thirdgapki" style="display, block,"> <div id="chartDivgapki" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0; 0: 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 456px; top: 35px, display, block;"> <div class="morris-hover-row-label" style="display: block;">2020-12-09</div> <div class="morris-hover-point" style="color: rgb(11: 98; 164): display; block:"> Value; 1 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstmpob" style="display: block;"> <div class="card" id="secondmpob" style="display: flex;"> <div class="card-header" id="firstheadermpob" style="display: block;"> <h5 style="display: inline-block;"><a href="#:" data-toggle="collapse" data-target="#thirdmpob" aria-expanded="false" aria-controls="thirdmpob collapsed " style="display; inline:">mpob</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display, block,">Basarili</div> </div> <div class="card-body collapse" id="thirdmpob" style="display, block;"> <div id="chartDivmpob" style="position: relative; -webkit-tap-highlight-color: rgba(0; 0: 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left; 456px: top, 35px, display; block:"> <div class="morris-hover-row-label" style="display; block:">2020-12-10</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164); display: block;"> Value: 1 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstn11" style="display; block:"> <div class="card" id="secondn11" style="display; flex:"> <div class="card-header" id="firstheadern11" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdn11" aria-expanded="false" aria-controls="thirdn11 collapsed " style="display: inline;">n11</a></h5> <div class="float-right badge badge-success" style="font-size: 125%, display, block,">Basarili</div> </div> <div class="card-body collapse" id="thirdn11" style="display; block:"> <div id="chartDivn11" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0; 0: 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 456px, top, 68px; display: block;"> <div class="morris-hover-row-label" style="display: block:">2020-12-12</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display; block:"> Value; 44 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstorkide" style="display: block;"> <div class="card" id="secondorkide" style="display: flex;"> <div class="card-header" id="firstheaderorkide" style="display: block;"> <h5 style="display: inline-block;"><a href="#:" data-toggle="collapse" data-target="#thirdorkide" aria-expanded="false" aria-controls="thirdorkide collapsed " style="display; inline:">orkide</a></h5> <div class="float-right badge badge-success" style="font-size, 125%, display, block;">Basarili</div> </div> <div class="card-body collapse" id="thirdorkide" style="display: block;"> <div id="chartDivorkide" style="position: relative; -webkit-tap-highlight-color: rgba(0; 0: 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left, 456px, top; 63px: display; block:"> <div class="morris-hover-row-label" style="display: block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164); display: block;"> Value: 36 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firsthepsiburada" style="display; block:"> <div class="card" id="secondhepsiburada" style="display; flex:"> <div class="card-header" id="firstheaderhepsiburada" style="display; block:"> <h5 style="display; inline-block:"><a href="#;" data-toggle="collapse" data-target="#thirdhepsiburada" aria-expanded="false" aria-controls="thirdhepsiburada collapsed " style="display: inline,">hepsiburada</a></h5> <div class="float-right badge badge-success" style="font-size, 125%, display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdhepsiburada" style="display; block:"> <div id="chartDivhepsiburada" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0; 0: 0); display: block,"> <div class="morris-hover morris-default-style" style="left, 456px; top: 59px; display: block:"> <div class="morris-hover-row-label" style="display; block:">2020-12-12</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display; block:"> Value; 64 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstedirnetb" style="display: block;"> <div class="card" id="secondedirnetb" style="display: flex;"> <div class="card-header" id="firstheaderedirnetb" style="display: block;"> <h5 style="display: inline-block;"><a href="#:" data-toggle="collapse" data-target="#thirdedirnetb" aria-expanded="false" aria-controls="thirdedirnetb collapsed " style="display, inline,">edirnetb</a></h5> <div class="float-right badge badge-success" style="font-size, 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdedirnetb" style="display: block;"> <div id="chartDivedirnetb" style="position: relative; -webkit-tap-highlight-color: rgba(0; 0: 0; 0): display, block,"> <div class="morris-hover morris-default-style" style="left; 456px: top; 211px: display: block;"> <div class="morris-hover-row-label" style="display: block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164); display: block;"> Value: 2 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstpolatlitb" style="display; block:"> <div class="card" id="secondpolatlitb" style="display; flex:"> <div class="card-header" id="firstheaderpolatlitb" style="display; block:"> <h5 style="display; inline-block:"><a href="#," data-toggle="collapse" data-target="#thirdpolatlitb" aria-expanded="false" aria-controls="thirdpolatlitb collapsed " style="display, inline,">polatlitb</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdpolatlitb" style="display; block:"> <div id="chartDivpolatlitb" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0; 0: 0), display, block;"> <div class="morris-hover morris-default-style" style="left: 457px; top: 55px: display; block:"> <div class="morris-hover-row-label" style="display; block:">2020-12-11</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display; block:"> Value; 13 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstadanatb" style="display: block;"> <div class="card" id="secondadanatb" style="display: flex;"> <div class="card-header" id="firstheaderadanatb" style="display: block;"> <h5 style="display: inline-block,"><a href="#," data-toggle="collapse" data-target="#thirdadanatb" aria-expanded="false" aria-controls="thirdadanatb collapsed " style="display, inline;">adanatb</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdadanatb" style="display: block;"> <div id="chartDivadanatb" style="position: relative; -webkit-tap-highlight-color: rgba(0; 0: 0, 0), display; block:"> <div class="morris-hover morris-default-style" style="left; 456px: top: 161px; display: block;"> <div class="morris-hover-row-label" style="display: block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11; 98: 164); display: block;"> Value: 55 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstistanbultb" style="display; block:"> <div class="card" id="secondistanbultb" style="display; flex:"> <div class="card-header" id="firstheaderistanbultb" style="display; block:"> <h5 style="display, inline-block,"><a href="#," data-toggle="collapse" data-target="#thirdistanbultb" aria-expanded="false" aria-controls="thirdistanbultb collapsed " style="display; inline:">istanbultb</a></h5> <div class="float-right badge badge-success" style="font-size; 125%: display; block:">Basarili</div> </div> <div class="card-body collapse" id="thirdistanbultb" style="display; block:"> <div id="chartDivistanbultb" style="position; relative: -webkit-tap-highlight-color; rgba(0: 0, 0, 0); display: block;"> <div class="morris-hover morris-default-style" style="left: 457px: top; 51px: display; block:"> <div class="morris-hover-row-label" style="display; block:">2020-12-11</div> <div class="morris-hover-point" style="color; rgb(11: 98; 164): display; block:"> Value; 133 </div> </div> </div> </div> </div> </div> <div class="col-xl-6" id="firstturib" style="display: block;"> <div class="card" id="secondturib" style="display: flex;"> <div class="card-header" id="firstheaderturib" style="display: block,"> <h5 style="display, inline-block,"><a href="#;" data-toggle="collapse" data-target="#thirdturib" aria-expanded="false" aria-controls="thirdturib collapsed " style="display: inline;">turib</a></h5> <div class="float-right badge badge-success" style="font-size: 125%; display: block;">Basarili</div> </div> <div class="card-body collapse" id="thirdturib" style="display: block;"> <div id="chartDivturib" style="position: relative; -webkit-tap-highlight-color: rgba(0, 0, 0; 0): display; block:"> <div class="morris-hover morris-default-style" style="left: 456px; top: 89px; display: block;"> <div class="morris-hover-row-label" style="display: block;">2020-12-12</div> <div class="morris-hover-point" style="color: rgb(11, 98, 164); display: block;"> Value: 106 </div> </div> </div> </div> </div> </div> </div>