使用jQuery隐藏表格单元格中的子字符串

6 浏览
0 Comments

使用jQuery隐藏表格单元格中的子字符串

我想隐藏表格单元格中的子字符串。假设表格看起来像这样：

  

    

       Blah 
       Blah [100, 100]
       Blah [130, 70]

我该如何使用jQuery（和CSS）来隐藏第2个单元格中的[100,100]部分以及第3个单元格中的[130,70]部分？

在另一个类似问题的答案中，我找到了以下解决方案：

Good Stuff Hide Me
Great Stuff Hide Me
Best Stuff Hide Me
$('div.text').html(function (i, t) {
    return t.replace('Hide Me', '');
})

但是我认为我需要一个正则表达式的解决方案，因为[ ]部分的内容可能不同？还是有更好的主意吗？

0

3 答案

0 Comments

问题的原因是：Brian的回答是删除文本而不是隐藏它（如果您不需要将来的这些文本，这更节省成本）。但是，如果您确实需要将其隐藏以供将来参考，可以使用这个方法。作者倾向于使用更精确的正则表达式。Brian的正则表达式会删除方括号之间的所有内容。而上面这个正则表达式只会在方括号之间有两个以逗号分隔的数字时匹配。

解决方法是使用正则表达式的replace方法，并将匹配到的内容替换为一个带有class属性为"hidden"的span标签，从而隐藏该子字符串。可以使用以下代码实现：

t.replace(/(\s*\[s*\d+\s*,\s*\d+\s*\])/, '<span class="hidden">$1</span>')

相关的引用文档：

- 正则表达式参考 - https://www.w3schools.com/jsref/jsref_obj_regexp.asp

- 解析捕获组 - https://stackoverflow.com/a/6419076/7081773

0
0 Comments

jQuery隐藏表格单元格中的子字符串的原因是为了在表格中隐藏特定的文本。这种情况下，使用了jQuery的`.each()`方法来遍历每个表格单元格(`

`)。然后，通过使用`.text()`方法获取当前表格单元格的文本内容，并使用正则表达式替换掉其中的子字符串。最后，使用`.text()`方法将替换后的文本重新设置到表格单元格中。

解决方法如下所示：

$( 'td' ).each(function() {
    var currentText = $( this ).text();
    var newText = currentText.replace(/\[.+\]/g, '');
    $( this ).text( newText );
});

0
0 Comments

问题：如何使用jQuery隐藏表格单元格中的子字符串？

原因：在给定的代码中，我们可以看到有一个表格单元格，其中包含一个带有方括号的子字符串。我们的目标是使用jQuery将这些子字符串隐藏起来。

解决方法：为了解决这个问题，我们可以使用jQuery的html()方法和正则表达式替换函数。首先，我们使用选择器选择所有带有"class"属性值为"text"的div元素。然后，我们使用html()方法获取每个div元素的内容。接下来，我们使用正则表达式替换函数t.replace(/\[.*\]/g, '')将每个div元素的内容中的子字符串替换为空字符串。最后，我们使用html()方法将更新后的内容重新设置到每个div元素中。这样，我们就成功地隐藏了表格单元格中的子字符串。

下面是完整的解决方案代码：

$('div.text').html(function (i, t) {
    return t.replace(/\[.*\]/g, '');
})

通过使用这个解决方案，我们可以轻松地隐藏表格单元格中的子字符串。

0