從兄弟元素中尋找文本

Question

我有動態生成的HTML表，我想用JQuery。 看起來有點像這樣，只有更多的<tr>元素。

<table>
  <tr>
    <td class="name"> Apples </td>
    <td class="value"> 2.33 </td>
    <td class="amount"> <input type="text"></td>
  </tr>
</table>

我正在編寫的腳本將采用文本輸入字段中的任何內容，將其乘以值td指定的浮點數並輸出它。 但是，我在使用JQuery進行<td>遇到了問題。

我試過類似的東西

parseFloat($(".amount input").parent().siblings($("td.value")).text())

獲取值，但它不起作用 - 它似乎試圖將它乘以每個元素而不管類。 我嘗試了一個<tr> ，其中唯一的數據是整數...

2013-8-28 | 2.1 | 20

......它吐了4026.我不知道為什么。

所以，問題仍然存在：我如何從同一<tr>上的input開始獲取帶有類value的<td>的內容？

Answer 1

嘗試這個：

$(document).ready(function(){
    $('input').on('blur', function(){
       alert($(this).val() * $(this).parent().siblings('.value').text()); 
    });
})

Answer 2

怎么樣

$(".amount").parent().find('.value').text();

Answer 3

嘗試

HTML

<table>
  <tr>
    <td id="val1" class="name"> Apples </td>
    <td id="val2" class="value"> 2.33 </td>
    <td class="amount"> <input type="text"></td>
  </tr>
</table>

JavaScript的

function getvalue()
{
  var name = (document.getElementById('val1').innerText || document.getElementById('val1').textContent);

  var value = parseFloat(document.getElementById('val2').innerText || document.getElementById('val1').textContent);   
}

Answer 4

你可以試試

$('.amount').each(function(){
    var $this = $(this), amount = parseFloat($this.find('input').val()) || 0, rate = parseFloat($this.prev().text()) || 0;
    console.log(amount * rate)
})

Answer 5

更改

.siblings($("td.value"))

至

.siblings('td.value')

DEMO

Answer 6

這也應該有效

$('input').on('blur', function(){
   alert($(this).val() * $(this).parent().siblings('.value').text()); 
});

在這里工作小提琴

Answer 7

siblings()函數中的選擇器是錯誤的。 嘗試這個：

parseFloat($(".amount input").parent().siblings(".value").text())

示例小提琴

Answer 8

采用 ：

$('input').on('blur', function(){
   var value = $(this).closest("tr").siblings(".value").text(); 
});

Answer 9

有很多選擇：

$(".amount input").parent().prev("td.value").text() //good to use

要么

$(".amount input").parent().siblings("td.value").text()

要么

$(".amount input").parent().parent().find("td.value").text()

完整的工作演示

FIDDLE DEMO

Answer 10

我已經完成了你想要的keyup事件， FIDDLE

    jQuery(function(){
        $('.amount input').keyup(function(){
            var input_value = this.value;
            var values = $(this).parent().prev().text();
            alert(input_value * values);
        })
    })