Question

我正在尝试从表中获取值 - 在HTML下面如何使用jQuery提取30英镑的第一个价格？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="panel-body">
  <table class="table table-striped" style="margin-bottom: 15px; table-layout: fixed;">
    <tr>
      <td colspan="2"><span class="cartItem">1 sqft
                    Bundle</span>
      </td>
      <td style="width: 20px;">
        <a href="_add_item.php?agent=1&ht_currency=1&&" title="remove item"><span class="glyphicon glyphicon-remove-sign"></span></a>
      </td>
      <td>&pound;30.00</td>
    </tr>
    <tr id="basket-spacer-row">
      <td colspan="4">&nbsp;</td>
    </tr>
    <tr>
      <th colspan="3">Total</th>
      <th>&pound;30.00</th>
    </tr>
  </table>
</div>

Answer 1

您可以使用以下语法：

$('.table tr:not(#basket-spacer-row) th:last-child, .table tr:not(#basket-spacer-row) td:last-child').each(function() {
  var price = $(this).html() //this is your value
  console.log(price)
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="panel-body">
  <table class="table table-striped" style="margin-bottom: 15px; table-layout: fixed;">
    <tr>
      <td colspan="2"><span class="cartItem">1 sqft
                Bundle</span>
      </td>
      <td style="width: 20px;">
        <a href="_add_item.php?agent=1&ht_currency=1&&" title="remove item"><span class=
                    "glyphicon glyphicon-remove-sign"></span></a>
      </td>
      <td>&pound;30.00</td>
    </tr>
    <tr id="basket-spacer-row">
      <td colspan="4">&nbsp;</td>
    </tr>
    <tr>
      <th colspan="3">Total</th>
      <th>&pound;30.00</th>
    </tr>
  </table>
</div>

Answer 2

如果你的意思是最后的价格，那么

view

首先：

var pounds = $('#basket-spacer-row').next().find('th').last().text();

这取决于此表的呈现的动态程度。我总是喜欢ID选择器，因为它们是最具体的。这不好，但它的工作原理。我选择带有id的tr，移动到下一个兄弟并选择其中最后一个元素的文本。这看起来像spacer行应该总是在最后，所以这在大多数情况下都可以工作，但同样，这种类型的选择器和导航非常脆弱。您还可以检查£字符并根据其出现创建逻辑。

Fiddle

Answer 3

我不知道你在谈论哪30个。如果你在谈论第一个，

var p = $('.table tr:first-child td:last-child').text();

或者这个：

var p = $('.table tr:last-child th:last-child').text();

Answer 4

您可以使用以下语法：

function add_location(){
branch_open_time = $("#time_range_from").val();
barnch_close_time = $("#time_range_to").val();
$.ajax
    ({
        url : 'add_location',
        type: "POST",
        dataType: "text",
        data:{
            time_range_from: branch_open_time,
            time_range_to: barnch_close_time
        },
        success: function(data)
        {     
            location.reload();
        },
        error: function (jqXHR, textStatus, errorThrown)
        {
            alert('Error data');
        }

    });
}

更多信息：W3School Jquery Selectors

Answer 5

您可以使用prev()和find()

$('#basket-spacer-row').prev().find('td:last').text();

演示：https://jsfiddle.net/Lcjjz6da/

Answer 6

使用@value，仅获取数字值replace()，使用30.00

/[^\d.]/g会为您提供HTML内容。

$('.table tr:eq(0) td:eq(2)').html()

var cellValue = $('.table tr:eq(0) td:eq(2)').html();
console.log(cellValue);
yourString = cellValue.replace ( /[^\d.]/g, '');
console.log(yourString);

var cellValue = $('.table tr:eq(0) td:eq(2)').html();
console.log(cellValue);
yourString = cellValue.replace ( /[^\d.]/g, '');
console.log(yourString);

Answer 7

这可能对您有帮助，

$(document).ready(function () {
     $('.panel-body').find('table tr').first().find('td').last().text(); //this will give td's £30,
     $('.panel-body').find('table tr').last().find('th').last().text(); //this will give th's £30
});

如何使用JQuery

7 个答案: