Question

我正在尝试根据特定位置的用户定义值过滤部件号表。

参见jsFiddle - ＆gt; http://jsfiddle.net/bagofmilk/wx9F3/12/

问题是我允许多个条件 - 不只是一个角色的一个角色。

如果你看一下这个小提琴，你会看到我使用Table Sorter 2.0插件，效果很好。但我还在上面创建了一个带有7个文本框的小桌子。这些文本框中的每一个都代表下表中零件号的值。

'data-log' =如果文本框为空，则值为0，否则值为1.
'data-val' =零件编号字符串中的字符位置。

示例：如果用户在项目＃2中键入“07”，则脚本将需要过滤字符串中字符位置2处的部件号为“0”的表，字符位置处的“7”字符串中的3

大多数过滤器会在ENTIRE字符串中搜索“07”，但我需要这个特定于其位置。

我也需要它，以便当用户也在项目＃7中键入“L”时，脚本将过滤部分编号，其中“07”位于char位置2,3并且其中“L”位于char位置11在字符串中。

这是我正在尝试处理的主要功能：

$('.modx').keyup(function() {

   //I emtpy the "values" array and "position" array
    arrval = [];
    arrpos = [];

   //Whatever textbox the user types in must indicate there is a value
    $(this).attr('data-log', '1');


   //I create an array of user input values and their positions
    $('.modx').each(function() {
        if ($(this).attr('data-log') == 1) {
            arrval.push($(this).val());
            arrpos.push($(this).attr('data-val'));
        } else {}
    });

   /* THIS IS WHERE IM STUCK...Using the "values" array and "position" array, 
      check each part number where all values and positions are true. 
      I CANNOT COME UP WITH THE LOGIC HERE... */

});

我可能完全以错误的方式接近这一点。如果是这样，我会喜欢听到任何其他方法，或者如果你能想到我可以在这个键盘功能结束时应用的逻辑，那也很棒。

enter image description here

Answer 1

首先，让我们看看逻辑。 jQuery的filter()函数似乎是最实用的函数，它通过为每个结果元素运行一个过滤函数来工作。当此函数返回true时，该元素将包含在已过滤的集合中。

因此，在filter函数中，我们需要检查实际行的值（在这种情况下，行中第一个单元格的文本值）是否满足存储在数组中的所有要求。

为此，我们迭代arrpos。对于每个值，我们使用substr()来提取被检查字符串的相关部分（位置是来自arrpos的当前值，length是当前arrval元素的长度）然后比较它来自arrval的当前值。如果它们不相等，则检查已失败，因此我们返回false。如果for循环完成运行，我们确定我们可以返回true（每次检查都成功）。

一个简单的实现（未经过全面测试，只是说明）：

   $('#partNumbers tbody tr') //get the rows
       .hide() //hide all of them
       .filter(function () {
            var tValue = $(this).find('td:first').text();
            for (var i = 0, l = arrpos.length; i < l; i++) {
                if (tValue.substr(arrpos[i], arrval[i].length) !== arrval[i]) {
                    return false;
                }
            }
            return true;
        })
           .show(); //show only the filtered ones (for which true was returned)

jsFiddle Demo

Answer 2

这是一个正则表达式基础解决方案

将另外的data- *属性数据长度添加到第二个和第五个modx文本字段，如下所示

<input type='text' data-log='0' data-val='1' tabindex='2' placeholder='03' class='size2 modx' id='item2' data-length="2"/>
....
<input type='text' data-log='0' data-val='7' tabindex='6' placeholder='53'class='size2 modx' id='item6' data-length="2"/>

然后

var $modxs = $('.modx').keyup(function () {
    var string = $modxs.map(function () {
        var value = $.trim(this.value),
            length = $(this).data('length') || 1;
        while (value.length < length) {
            value += '.';
        }
        return value;
    }).get().join('');
    string = string.replace(/(.{3})(.{5})(.{1})/, '$1-$2-$3');
    var regex = new RegExp(string, 'i');
    $('#partNumbers tbody tr').hide().filter(function () {
        return regex.test($.trim($(this).children().first().text()))
    }).show()
});
$('#clearBtn').click(function(){
    $modxs.val('');
    $('#partNumbers tbody tr').show()
})

演示：Fiddle

jquery根据特定位置的特定字符过滤值

2 个答案: