1

役立つスレッドをいくつか見つけましたが、私の質問に直接答えるものはなかったので、具体的な問題は次のとおりです。

私の限られた jQuery スキルを磨くために、次の入力に基づいてボタンをクリックするだけで金額を計算する Split the Bill/Tip Calculator を作成しています: Bill Total、Tip Percentage、Number of People。

ただし、ボタンをクリックしても何も起こりません。jQueryコードは次のとおりです。

$(document).ready(function() {
$('button').click(function(){
var Total = $('.Total').val();
var Tip = $('.Tip').val();
var NumberOfPeople = $('.NumberOfPeople').val();
var AdjTotal = (((Tip/100)*Total)+Total).toFixed(2);
var Result = (AdjTotal/NumberOfPeople).toFixed(2);
if(isNaN(AdjTotal)) {
    $('.result').remove();
    $('.error').remove();
    $('.price').append('<p class="error">Please enter valid numbers into the above fields.</p>');
}
else {
    $('.error').remove();
    $('.result').remove();
    $('.price').append('<p class="result">Your total is $' + AdjTotal + ' ' + 'and each person owes: $' + Result + '.</p>');
}
});
});

そしてHTML：

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="style.css" />
        <script src='script.js'></script>
        <title>Split the Bill</title>
    </head>
    <body>
        <div class="header">
            <h1>Split the Bill</h1>
        </div>
        <div>
            <table>
                <tbody>
                    <tr>
                        <td align="right">
                            Bill Total: $
                        </td>
                        <td text-align="left">
                            <input class="Total" type="text" name="Total">
                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            Tip Percentage: 
                        </td>
                        <td text-align="left">
                        <input class="Tip" type="text" name="Tip"> %
                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            Number of People: 
                        </td>
                        <td colspan=3>
                            <input class="NumberOfPeople" type="text" name="Number of People">
                        </td>
                    </tr>
                    <tr>
                        <td colspan=4 align="right">
                            <button>Calculate</button>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div class="price">
        </div>
    </body>
</html>

助けてくれてありがとう！

4

1 に答える 1

1

問題は次の行です。

var AdjTotal = (((Tip/100)*Total)+Total).toFixed(2);

合計は文字列です。強制的に数値にする必要があります。

var AdjTotal = (((Tip/100)*Total)+Total/1).toFixed(2);

http://jsfiddle.net/59WXX/

于 2013-03-18T15:34:25.580 に答える