首页 > 解决方案 > 查找包含数字和文本混合的跨度并获得第二个数字的总和

问题描述

我正在为一个简单的 html 游戏开发一个插件。在其中的一部分中,我想展示一个球员能力的总体维持。目前它们显示在每种能力上,我认为让我的插件在页面顶部显示总数会很好。元素如下所示:

<div class="col-sm-4 col-xs-12 text-center" style="padding-top: 10px;">
   <p style="background-color: red;">
      <b>Upkeep: </b>31 Bux each<br>1798 Bux total</p>
</div>

我添加了一条线,将跨度背景变为红色,这样我就可以看到我至少抓住了正确的元素。到目前为止,我的代码正在返回 NaN。这是我的代码:

var sumdtotal = 0;
    $('div[class="col-sm-4 col-xs-12 text-center"] p').each(function() {
    var value = $(this).text().replace(" Bux each", "").replace(" Bux total", "");
    sumdtotal += +value;
    $(this).css( "background-color", "red" );
    });
    $("#totalupkeep").text(sumdtotal);

这个想法是在跨度#totalupkeep 中显示总保养。

谢谢!

标签: javascriptjqueryhtml

解决方案


您可以使用正则表达式来获取数字。您没有 ID 为 totalupkeep 的元素,因此我不确定您要如何显示它。我也不完全清楚您要进行哪些计算。希望这会有所帮助:

$('div[class="col-sm-4 col-xs-12 text-center"] p').each(function() {
  var value = $(this).text().match( /\d+/g )
  $(this).css( "background-color", "red" );
  $("#totalupkeep").text('' + value[1]);
});

https://jsfiddle.net/gf1rcqoy/3/

编辑:值是一个包含两个数字的数组。第一个值是每个,第二个是总计。


推荐阅读