Javascript 表中的搜索数据无效

我目前正在研究javascript。在这段代码中，我有一个表和一个文本框。当我在文本框中输入数据时，它应该显示我键入的特定值，但它不会搜索表中的任何数据。如何在表中搜索数据？我提供了以下链接

课程代码
课程名称
在此处搜索：
函数doSearch（）{
var q=document.getElementById（“q”）；
var v=q.value.toLowerCase（）；
var rows=document.getElementsByTagName（“tr”）；
var on=0；
对于（变量i=0；i=3&&fullname.indexOf（v）>-1））{
行[i].style.display=“”；
关于++；
}否则{
行[i].style.display=“无”；
}
}
}
}

我想强调这段代码的几点：

• 在代码中，循环从0开始，因为表的第一行是标题行，所以它不包含任何“tr”元素。因此，您的功能不起作用
• 如果我们从1开始循环，则需要遍历输入元素来搜索值。现有的方法行不通

如果循环从1开始，则fullname变量如下所示：

---

可能您必须通过获取输入字段的值来修改比较逻辑。

好的，这是一个工作版本，但您的算法并不完美。 您可以调试和修复逻辑错误：

第一个问题：

onKeyUp="javascript:doSearch();"

与您的相比，有许多语义错误，但仍然不完美： （然后是3个字母的问题，当它发现某个东西时会出现）

如果您键入“course”，它会找到，但仍然保持所有内容可见（您必须修复它，这很容易） 如果你输入的字母少于3个，什么也不做，不要全部隐藏

function doSearch() {
var q = document.getElementById("q");
var v = q.value.toLowerCase();
var rows = document.getElementsByTagName("tr");
var on = 0;
for (var i = 0; i < rows.length; i++) {
    var fullname = rows[i].getElementsByTagName("td");
    if (fullname.length > 0) {
        fullname = fullname[0].innerHTML.toLowerCase();
        if (fullname) {
            if (v.length == 0 || (v.length < 3 && fullname.indexOf(v) == 0) || (v.length >= 3 && fullname.indexOf(v) > -1)) {
                rows[i].style.display = "";
                on++;
            } else {
                rows[i].style.display = "none";
            }
        }
    }
  }
}

函数doSearch（）{
var q=document.getElementById（“q”）；
var v=q.value.toLowerCase（）；
var rows=document.getElementsByTagName（“tr”）；
var on=0；
对于（变量i=0；i0）{
fullname=fullname[0]。innerHTML.toLowerCase（）；
if（全名）{
if（v.length==0 | |（v.length<3&&fullname.indexOf（v）==0）| |（v.length>=3&&fullname.indexOf（v）>-1））{
行[i].style.display=“”；
关于++；
}否则{
行[i].style.display=“无”；
}
}
}
}
}

您的html是您想要的方式吗？您似乎希望创建一个包含行的表，然后根据用户输入筛选这些行。按照现在html的方式，只有一行

在解决这个问题之后，我建议使用jquery。下面是一把小提琴，让您开始：

$（函数（）{
var q=$（'#q'），
框=$（“td输入”）；
$（'#q'）。关于（'keyup'，函数（e）{
var qterm=q.val（）；
如果（qterm.length<3）{
box.show（）；
}否则{
框。每个（功能（i、o）{
变量框=$（此）；
切换（box.val（）.indexOf（qterm）>-1）；
});
}
});
});

---

编辑：注意，小提琴正在过滤输入框，现在是行（因为没有要过滤的行）

请不要使用

查看并检查错误。应该能很好地指出哪里出了问题。也许他不能使用jquery库。

function doSearch() {
var q = document.getElementById("q");
var v = q.value.toLowerCase();
var rows = document.getElementsByTagName("tr");
var on = 0;
for (var i = 0; i < rows.length; i++) {
    var fullname = rows[i].getElementsByTagName("td");
    if (fullname.length > 0) {
        fullname = fullname[0].innerHTML.toLowerCase();
        if (fullname) {
            if (v.length == 0 || (v.length < 3 && fullname.indexOf(v) == 0) || (v.length >= 3 && fullname.indexOf(v) > -1)) {
                rows[i].style.display = "";
                on++;
            } else {
                rows[i].style.display = "none";
            }
        }
    }
  }
}

$(function () {
    var q = $('#q'),
        boxes = $('td input');

    $('#q').on('keyup', function (e) {
        var qterm = q.val();

        if (qterm.length < 3) {
            boxes.show();
        } else {
            boxes.each(function(i,o) {
                var box = $(this);
                box.toggle(box.val().indexOf(qterm) > -1);
            });
        }
    });
});