Javascript - 兩個相同元素的實例

我正在嘗試在Javascript中編寫貸款計算器。Javascript - 兩個相同元素的實例

你可以看看這裏：http://codepen.io/saltcod/pen/vHrfc

事情很好地工作，只是當我點擊嘗試和計算器的第二個實例（通過+按鈕）添加到頁面。當我這樣做時，兩個計算器不能獨立工作。

如何讓頁面上的所有計算器獨立行動？

感謝任何能夠指引我走向正確方向的人。

特里

2013-09-28 saltcod

當你添加一個新的計算器時，你正在克隆一個現有的計算器，它將克隆ID等ID在頁面上必須是唯一的。如果他們不是，你會遇到麻煩。我還注意到，你的選擇器使用類而不是ID。儘管類不一定是唯一的，但您的選擇器可能會超出您的預期。 – 2013-09-28 01:45:25

在另一張紙條上你的貸款計算是不正確的。查看橡樹道路系統公司（http://oakroadsystems.com/math/loan.htm）獲取財務數學公式的解釋。也許看看Formula.js（http://stoic.com/formula/），它是一個開源JavaScript庫，實現了這些標準貸款公式（與Excel的結果非常接近）。 –

你的計算是正確的。我知道有些東西沒有加起來！謝謝！ – saltcod

第一，不要用id屬性，除非它們被用來識別每次都相同的元素。由於您克隆了相同的元素，並且由於可以在這些元素中的任何一個元素上發生鍵控操作，因此可以使用class來代替。

另一件事是，你只附加在原始計算器中的元素的鍵控處理程序。一旦你克隆它，那麼新的計算器沒有附加處理程序。相反，您可以使用委託

$(document).on("keyup", selectors, handler)

其中處理函數，你可以添加

group = $(this).parents(".loan.group")

而且所有的選擇應該有group的範圍，例如：

... years = +$('.years',group).val(),而不是... years = +$('.years').val(),

here is an improved version of your calculator, I hope this helps

來源

2013-09-28 02:11:44 GuiDocs

非常感謝。我應該知道不要使用ID！謝謝！ – saltcod

Javascript - 兩個相同元素的實例

回答

相關問題