Question

我遇到了从html字符串段落中检测数字的问题。让我先来看一下html页面的概述。

1个仅包含数字的表格
包含字母，数字和符号的1段

我要做的是，当用户将鼠标悬停或悬停在段落中的任何数字上时，表格中的相同数字将会更改样式（可能会突出显示）。

问题是，如何通过鼠标悬停或悬停使用jQuery从段落中提取数字？

我一直在考虑为段落中的每个数字值添加span标记，以便我可以使用`$（this）.find（＆＃39; span＆＃39;）。text（...）来匹配然后用桌子的细胞。

任何人都会告诉我如何开始检测？ Tqvm！

Answer 1

您可以使用正则表达式从文本中获取所有数字，然后使用它执行某些操作。

// Set your selector here, because its probably not all 'p' elements
$("p").hover(function(){
    var paragraphText = $(this).text();
    var allNumbers = paragraphText.match( /\d+/g );
    console.log(allNumbers); // A string, comma seperated, with all numbers
    var numbersArray = allNumbers.split(',');
    console.log(numbersArray); // An array of all the numbers

    // Loop through the array and do something with each number.
    $.each(numbersArray, function(index, theNumber){
        console.log(theNumber);
    });

});

Answer 2

.navbar-default
{
background-color: #7574bf;
}

$(document).ready(function(){
  var tds = $('td');
  
  $('span').on('mouseenter ', function(){
    var text = $(this).text();
    $.each(tds, function(i, l){
      var tmp = tds.eq(i).text();
      if (tmp == text) {
        tds.eq(i).addClass('highlight');
      } else {
        tds.eq(i).removeClass('highlight');
      }
    });
  });

  $('span').on('mouseleave', function(){
    $.each(tds, function(i, l){
      tds.eq(i).removeClass('highlight');
    });
  });
  
});

.highlight{
  background-color: red;
}

在鼠标悬停/悬停期间从特定文本段落中仅获取数字编号

2 个答案: