jquery - 如何使用 Jquery 获取粗体标签内的值

Question

我有一张 table

<div class="main">
<table>
 <tr>
     <td>
         <b class="bold">1500></b>
     </td>
     <td>
        <b class="bold">2500></b>
     </td>
     <td>
        <b class="bold">4500></b>
     </td>
 </tr>
</table>
<input type="text" id="displayTotal"/>
<input type="button" id="btnAdd" value="Get Total"/>
</div>

现在单击按钮，我想在类名粗体的粗体标签中添加值。 我尝试使用

<script>
$('#btnAdd').click(function(){
var a=$("div.bold").Val();

我不知道下一步该做什么。任何人请帮忙。我希望文本框中的结果为 8500

Answer 1

您的 html 无效。 b 必须关闭。在您可以使用迭代器并使用 jquery text() 后，您可以获得值并对它们求和，如下所示:

$('#btnAdd').click(function() {
  //declare a variable to keep the values
  var sum = 0;
  //use each to iterate through b elements
  $("div.main table tr td b").each(function() {
    //sum the values
    sum += parseInt($(this).text(), 10);
  });
  //change input value with the new one
  $("#displayTotal").val(sum);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="main">
  <table>
    <tr>
      <td> <b class="bold">1500</b>

      </td>
      <td> <b class="bold">2500</b>

      </td>
      <td> <b class="bold">4500</b>

      </td>
    </tr>
  </table>
  <input type="text" id="displayTotal" />
  <input type="button" id="btnAdd" value="Get Total" />
</div>