Question

我有一个搜索栏来显示包含特定值的单元格的行，但我只想要那些以该值开头的行，只有当它们以它开头时才会出现，而不是如果它们包含在字符串。

这就是我所拥有的：

var $rows = $('#tableID tbody tr');

$('#search').keyup(function() {
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();

    $rows.show().filter(function() {
        var text = $('.filterClass', this).text().replace(/\s+/g, ' ').toLowerCase();
        return !~text.indexOf(val);
    }).hide();
});

Answer 1

您的代码的作用：您正在使用indexOf来测试val的状态（~ operator正在转换-1到0 "falsy"因此!~text.indexOf(val)基本上会测试val是否在text中的任何位置。

解决方案：只检查indexOf是0（换句话说，val是从0开始的text }}）：

var $rows = $('#tableID tbody tr');

$('#search').keyup(function() {
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();

    $rows.show().filter(function() {
        var text = $('.filterClass', this).text().replace(/\s+/g, ' ').toLowerCase();
        return text.indexOf(val) !== 0;     // <-- Note this line
    }).hide();
});

旁注：理解“仅显示此行”的代码比理解“隐藏所有非行”更简单喜欢这个“。我建议改变你的代码结构：

 $rows.hide()
 $rows.filter(/* your filter code */).show()

（这也意味着从return语句中删除感叹号）

Answer 2

只需检查indexOf()的结果是否等于0。而不是!~text.indexOf(val)使用text.indexOf(val) !== 0。

Answer 3

是否可以与过滤器链接组合使用，例如：A、B、C？

然后在搜索下输入<a href="#A">

然后开始过滤这个“词”？

var $rows = $('section article');
$('#search').keyup(function() {
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();
    $rows.show().filter(function() {
        var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
        return !~text.indexOf(val);
    }).hide();});

过滤字符串起始值

3 个答案: