使 jquery 脚本智能

Question

有 3 个输入字段。 每个都有自己的隐藏输入，其中包含值。

目前脚本仅适用于 Bananas。(:-))

1 根香蕉相当于 1 根香蕉或 0.5 个苹果或 0.021 块饼干（换句话说，1 个苹果 = 2 根香蕉，46 根香蕉 = 饼干，1 根香蕉 = 1 根香蕉）。

我希望这个脚本做的是计算苹果和饼干的价值，并将它们相加以显示它们在“其他”货币中的价值。（例如显示 3 个苹果和 4 个饼干的价格所有 3 种货币）

我确实意识到代码非常......好吧，将其称为代码将是一种耻辱。

我只是不知道该怎么做；

任何帮助将不胜感激。

小提琴： http://jsfiddle.net/eN7S6/9/

HTML：

    <table>
    <tr>
        <td>
Apple<input name="inputone" id="inputone" class="calc" value="0"><span id="TotalOne"></span>
            </td>
    </tr>
        <tr>
        <td>
Banana<input name="inputtwo" id="inputtwo" class="calc" value="0"><span id="TotalTwo"></span>
            </td>
            </tr>
                    <tr>
        <td>
Cookie<input name="inputthree" id="inputthree" class="calc" value="0"><span id="TotalThree"></span>
            </td>
            </tr>
</table>
    <input name="multiplierone" id="multiplierone" class="calc" value="1" type="hidden" readonly>
    <input name="multipliertwo" id="multipliertwo" class="calc" value="0.5" type="hidden" readonly>
            <input name="multiplierthree" id="multiplierthree" class="calc" value="23" type="hidden" readonly>
    <input type="button" id="update" value="Calculate" />

JQ：

$(document).ready(function() {      
    $('#update').click(function() { 
        var inputone = $('#inputone').val();
        var multiplierone = $('#multiplierone').val();
        var inputtwo = $('#inputtwo').val();
        var multipliertwo = $('#multipliertwo').val();
        var inputthree = $('#inputthree').val();
        var multiplierthree = $('#multiplierthree').val();
        var totalTotalOne = (inputtwo * multipliertwo);
        var totalTotalTwo = (inputtwo);
        var totalTotalThree = (inputtwo / multiplierthree / 2);
        $('#TotalOne').text(totalTotalOne);
        $('#TotalTwo').text(totalTotalTwo);
        $('#TotalThree').text(totalTotalThree);
    });
}); 

Answer 1

嗯，从我从您那里收集到的描述是，您想要获得您拥有的特定物品的数量。因此，如果您有 10 根香蕉，您想根据其他元素计算这 10 根香蕉。如果你有 37 个 cookie，你想知道它相对于其他项目的价值也是如此。

我相信，如果您要将 UI 简化为两个元素，一个是用于输入金额的输入文本字段，另一个是单选支票集合，或者它可以是一个用于选择您拥有的类型的选择字段，这样会更有意义。

在您当前的设置中，您没有考虑到您的 type(Apple, Banana, cookie) 变量将更改其唯一的硬编码来计算香蕉。

我快速设置了一个 jsbin 来告诉你我的意思。这只是一个开始，可能会帮助您考虑其他事情要做。编码愉快！

http://jsbin.com/EKisiGIK/10/edit

Answer 2

$(document).ready(function() { 
 $('#update').click(function() {
   var inputone = parseFloat($('#inputone').val());
    var multiplierone = parseFloat($('#multiplierone').val()); 
    var inputtwo =parseFloat( $('#inputtwo').val());
    var multipliertwo = parseFloat($('#multipliertwo').val());
    var inputthree =parseFloat( $('#inputthree').val());       
    var multiplierthree = parseFloat($('#multiplierthree').val());
     var totalTotalOne = (inputtwo * multipliertwo);           
     var totalTotalTwo = (inputtwo); 
     var totalTotalThree = (inputtwo / multiplierthree / 2); 
      $('#TotalOne').text(totalTotalOne); 
      $('#TotalTwo').text(totalTotalTwo); 
      $('#TotalThree').text(totalTotalThree); 
    });
 });

试试这个

Answer 3

为了让这个问题更简单，您可以做的一件事是将所有货币转换为基础货币，然后再转换为各自的货币。使用您给出的示例，我已将所有货币转换为它们的 Cookie 等值，因为它是最有价值的，因此无需使用十进制值。

将 HTML 更改为

<input name="multiplierone" id="multiplierone" class="calc" value="23" type="hidden" readonly>
<input name="multipliertwo" id="multipliertwo" class="calc" value="46" type="hidden" readonly>
<input name="multiplierthree" id="multiplierthree" class="calc" value="1" type="hidden" readonly>

这是组成一个Cookie 所需的每种货币的数量。 然后可以使用以下代码将货币转换为Cookies

var base_total = inputone / multiplierone + inputtwo / multipliertwo + inputthree / multiplierthree;
var totalTotalOne = (base_total * multiplierone);
var totalTotalTwo = (base_total * multipliertwo);
var totalTotalThree = (base_total * multiplierthree);

此代码会将所有单独的输入值转换为等效的Cookie 值。一旦您将所有字段的总和作为 cookie 值，就可以将该值转换回所有相应的货币值。

Fiddle