在兩種不同類型的元素中顯示函數的結果

我使用此函數來合計列中所有值的總和。我希望將結果顯示在輸入框中以及它當前所在的單元格中。由於需要引用一個值，所以我只是將它們混合在一起的語法上。在兩種不同類型的元素中顯示函數的結果

JQuery的

$(document).ready(function(){ 
$('#front_finish, #back_finish').change(function(){ 
    function tally (selector) { 
     $(selector).each(function() { 
      var total = 0, 
       column = $(this).siblings(selector).andSelf().index(this); 
      $(this).parents().prevUntil(':has(' + selector + ')').each(function() { 
       total += parseFloat($('td.sum:eq(' + column + ')', this).html()) || 0; 
      }) 
      $(this).html(total); 
     }); 
    } 
    tally('td.total'); 
    }); 
});

輸入

<input type="text" name="glass_total" id="glass_total" value="0" />

表

<table id="data"> 
<tr> 
    <th>Finish</th> 
    <th>Pattern</th> 
    <th>Price</th> 
</tr> 
<tr> 
    <td>Front Finish:</td> 
    <td><span id="front_finish_name">Mirror</span></td> 
    <td class="sum" id="front_finish_price">15</td> 
</tr> 
<tr> 
    <td>Front Pattern:</td> 
    <td><span id="front_pattern_name"></span></td> 
    <td class="sum" id="front_pattern_price"></td> 
</tr> 
<tr> 
    <td>Back Finish:</td> 
    <td><span id="back_finish_name">Mirror</span></td> 
    <td class="sum" id="back_finish_price">15</td> 
</tr> 
<tr> 
    <td>Back Pattern:</td> 
    <td><span id="back_pattern_name"></span></td> 
    <td class="sum" id="back_pattern_price"></td> 
</tr> 
<tr> 
    <th colspan="2" align="right">Total</th> 
    <td class="total"></td> 
</tr>

來源

2011-06-22 Thomas

你可以顯示更多的html？我不確定文本框和列之間的關係。 –

是的。我已更新該帖子。兩者之間並沒有真正的關係。我試圖通過PHP向總體結果發送電子郵件，發送輸入值比單元格中的某些文本要容易得多。 – Thomas

那麼glass_total如何與列進行交互？ –

我認爲你的jQuery可能有點關閉。試試這個：

$(document).ready(function() { 
    $('#front_finish, #back_finish').change(function() { 
     var total = 0, temp; 
     $("#data td.sum").each(function() { 
      temp = $(this).html(); 
      if (!temp) { 
       return; 
      } 
      temp = parseFloat(temp); 
      if (isNaN(temp)) { 
       return; 
      } 
      total += temp; 
     }); 
     $("#data td.total").html(total); 
     $("#glass_total").val(total); // if you want it in the textbox 
    }); 
});

來源

2011-06-22 23:32:53

感謝您的澄清。 – Thomas

我有點被各自您發佈的HTML混淆只有一個td.total 。如果，真的有一個那麼所有你需要做的是這樣的：

$("#glass_total").val(total);

如果有多個你需要解釋一點，因爲輸入似乎是唯一的。

來源

2011-06-22 23:27:40

它是獨一無二的。我只是希望總數同時出現在td.total和#glass_total的值中。請原諒我，如果我是鈍或鈍。 – Thomas

然後我認爲這會爲你做。 –

感謝您的幫助 – Thomas

在兩種不同類型的元素中顯示函數的結果

回答

相關問題