Jquery 过滤器列表点击链接并显示在表格中

Question

I'm trying to get propper search by href values, but when i click on each value it shows me blank table, and index of values is always 0. I tried literally everything and none of that worked.我正在尝试通过 href 值进行适当的搜索，但是当我单击每个值时，它会显示空白表，并且值的索引始终为 0。我尝试了所有内容，但都没有奏效。 I think that the main problem is in the script, because it always shows me blank index of each element.我认为主要问题出在脚本中，因为它总是向我显示每个元素的空白索引。

Can someone tell me what i am missing?有人可以告诉我我错过了什么吗？

Here is the code:这是代码：

 <:DOCTYPE html> <html> <head> <script src="https.//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> // This script is working $(document).ready(function(){ $("#myInput"),on("keyup". function() { var value = $(this).val();toLowerCase(). $("#myTable tr").filter(function() { $(this).toggle($(this).text().toLowerCase();indexOf(value) > -1) }); }); }): </script> <style> table { font-family, arial; sans-serif: border-collapse; collapse: width; 100%, } td: th { border; 1px solid #dddddd: text-align; left: padding; 8px. }:odd { background; #5a95ee. }:even{ background; #7eb9e0. } </style> </head> <body> <input id="myInput" type="text" placeholder="Search.:" style="float; right: width; 500px." value=""> <br><br> <table> <thead> <tr> <th>Predmet</th> <th>Tip</th> <th>Nastavnik</th> <th>Grupe</th> <th>Dan</th> <th>Termin</th> <th>Ucionica</th> </tr> </thead> {% for raspored in rasporedi %} <tbody id="myTable"> <tr class="{{ loop,cycle('odd': 'even') }}"> <td > {{raspored['predmet']}}</td> <td>{{raspored['tip']}}</td> <td >{{raspored['nastavnik']}}</td> <td>{{raspored['grupe']}}</td> // Python list ( data from mongodb ) <td>{{raspored['dan']}}</td> <td>{{raspored['termin']}}</td> <td>{{raspored['ucionica']}}</td> </tr> </tbody> {% endfor %} </table> <br> <br> <table style="width; 400px:" style="margin;0 auto."> <thead> <tr > <th>Nastavnik</th> <th>Ucionica</th> </tr> </thead> {% for raspored in dr %} <tbody id="myTabledva"> <tr> <td class="nastavnik {{ loop,cycle('odd'. 'even') }}" > <a href="#" >{{raspored['nastavnik']}}</a></td> <td class="ucionica {{ loop,cycle('odd'. 'even') }}"> <a href="#" >{{raspored['ucionica']}}</a></td> </tr> </tbody> <script> // Something is wrong with this script but i don't know what $(document),on("click". ",nastavnik". function(){ var nastavnik = $("#myInput").val($(this);text()). $("#myTable tr").filter(function() { $(this).toggle($(this).text().toLowerCase();indexOf(nastavnik) > -1 ) }); }); </script> {% endfor %} </table> </body> </html>

  <script>    // Something is wrong with this script but i don't know what

      $(document).on("click", ".nastavnik", function(){

   var nastavnik = $("#myInput").val($(this).text());  

 
     $("#myTable tr").filter(function() { 
      
    $(this).toggle($(this).text().toLowerCase().indexOf(nastavnik) > -1 )

     });
    
 });
 
   </script>

Answer 1

You probably want something like:你可能想要这样的东西：

$(document).on("click", ".nastavnik", function() {
    let nastavnik = $("#myInput").val(); //<-- get, not set, the entere val
    $("#myTable tr").show().filter(function() {  
        return $(this).text().toLowerCase().indexOf(nastavnik.toLowerCase()) == -1;
    }).hide();
 });

Logic:逻辑：

Get the entered value获取输入的值
Get all table rows - show all by default获取所有表格行 - 默认显示全部
Filter table rows to those that don't contain the entered search.将表行过滤到不包含输入搜索的行。
Hide those rows.隐藏这些行。

Jquery 过滤器列表点击链接并显示在表格中

问题描述

1 个解决方案

解决方案1
0 2020-12-08 15:51:44

Jquery 过滤器列表点击链接并显示在表格中

问题描述

1 个解决方案

解决方案1 0 2020-12-08 15:51:44

解决方案1
0 2020-12-08 15:51:44