jQuery字符串替换匹配的正则表达式

Question

我试图通过用字符串替换每个单元格中的数据来格式化表格的整个列。简单地说，如果我在输入字段中输入“nargles”并单击表格列顶部的格式按钮，则该列中每个单元格中的文本都将替换为“nargles”。这工作正常。

我的问题涉及用表值替换输入字符串中的“%0”、“%1”、“%2”等实例。 %0 对应于第 0 列，%1 对应于第 1 列，%2 对应于第 2 列，等等。此外，它必须获取正在修改的当前行的列值。

举个例子来说明一下，让我们看一下表格：

1    cat     description
2    dog     description
3    fish    description

如果我输入“Row %0 is for %1”作为输入并在第 3 列执行，结果将是：

1    cat     Row 1 is for cat
2    dog     Row 2 is for dog
3    fish    Row 3 is for fish

希望这是一个充分的解释 =)

所以，这里是示例表中的一个示例：

<tr>
    <td></td>
    <td><button class="format" col="1">Format Col</button></td>
    <td><button class="format" col="2" >Format Col</button></td>
</tr>

<tr>
    <td><input type="text" col="0" row="0" value="0" size="1"></td>
    <td><input type="text" col="1" row="0" value="cat" /></td>
    <td><input type="text" col="2" row="0" value="description" /></td>
</tr>

...

这是每列顶部格式按钮的代码

$('td button.format').on('click', function () {

    // get formatter variables and column number
    string = $("#formatter").attr("value");
    column = $(this).attr("col");

    // regex to globally look for %d (where d is an integer)
    var re = new RegExp("\%(\\d+)", "g");

    $('td input[col="' + column + '"]').each(function (row) {
        // replace string here
    });
});

目前，此代码结构将捕获第一列的值并且工作正常

$('td input[col="' + column + '"]').each(function (i) {
    $(this).attr("value", string.replace(re, $('td input[col="1" row="' + i +'"]').attr('value')));
});

但是做这样的事情（输入“%2”）会导致“undefined 2”。 （我用col="\$1" 替换了上面的col="1" 并附加了“\$1”以使用找到的第一个匹配的正则表达式）。我还应该注意，除了“\$1”之外，我还没有使用“$1”和“\$1”。

$('td input[col="' + column + '"]').each(function (i) {
    $(this).attr("value", string.replace(re, $('td input[col="\$1" row="' + i +'"]').attr('value') + " \$1"));
});

我的结论是，将正则表达式匹配替换为jquery查找的时间和执行查找的时间不正确。由于结果是“未定义 2”，我知道正则表达式匹配，但查找不正确。但是，我知道代码通常是正确的，因为硬编码 col="2" 可以工作。

关于为什么会遇到麻烦的任何想法。我想说它是一个语法问题，但也许我错了。

旁注：如果我只使用re.match() 函数并遍历返回的数组，这一切都可以避免。我知道存在解决方案，我只是看看是否有更优雅/更清洁的方法。

我知道这很长，对不起！我认为更多信息总比不够好。感谢您一直阅读！

Answer 1

我猜你正在寻找这样的东西：

 $('td button.format').click(function () {
     var template = "Row %0 is for %1";
     var col = $(this).attr("col");

     $("#body tr").each(function() {
         var $row = $(this);
         var t = template.replace(/%(\d+)/g, function($0, $1) {
             return $row.find("td:eq(" + $1 + ") input").val();
         });
         $row.find("td:eq(" + col + ") input").val(t)
     })
 })

完整示例： http://jsfiddle.net/TTjtU/