0

詳細を確認するために基本的なアプリケーションを作成していますが、問題が発生しました。

私は3つの入力ボックスを持っています。人、請求書、チップ。数学は次のとおりです。

(請求書 + チップ) / 人。コードを分割しようとすると、合計の最後に加算されるようです。

これまでのところ、私はこれを持っています。http://jsfiddle.net/ma9ic/a8eJT/

    var updateTotal = function () {
      var people = parseInt($('#people').val());
      var bill = ($('#bill').val());
      var tip = ($('#tip').val());
      var billTip = bill + tip;
      var billTipPeople = billTip / people;




      $('#total').text("£" + billTipPeople) 

正しい方向に向けることができれば、それは素晴らしいことです:)

4

6 に答える 6

4

あなたはかなり近いです。私はそれをこのように動作させました

var updateTotal = function () {
  var people = parseInt($('#people').val(),10);
  var bill = parseFloat($('#bill').val());
  var tip = parseFloat($('#tip').val());
  var billTip = bill + tip;
  var billTipPeople = billTip / people;
  if (isNaN(billTipPeople)) billTipPeople = 0; // output zero if NaN

  $('#total').text("£" + billTipPeople.toFixed(2)) 

問題は、javascript には文字列の連結に関するいくつかの奇妙な規則があることです。「1」+「1」==「11」。毎回明確にする必要があります。

parseInt GOTCHA : 常に parseInt の 2 番目 (オプション)の基本パラメーターを使用します。「015」のような値は、8 進数として解析され、10 進数の 13 になります。そのため、「なぜプログラマーはハロウィーンとクリスマスを混同するのでしょうか? 10 月 31 日 == 12 月 25 日だから!」というジョークがよく使われます。

于 2013-06-19T12:21:08.337 に答える
2

bill + tipどちらも文字列であるため、加算ではなく文字列連結を実行します。加算を実行する場合は、オペランドの少なくとも 1 つが数値でなければなりません。

whileparseFloatparseIntwork では、単項プラス演算子を使用する方が記述が短く、数値の型について心配する必要はありません。

var people = +$('#people').val();
var bill = +$('#bill').val();
var tip = +$('#tip').val();

これは、入力値が数値のみで構成されている限り機能します。しかし、入力が数字だけで始まる場合、たとえば"5 foo"、文字列の先頭から数字を抽出したい場合は、parseIntorを使用する必要がありparseFloatます。

于 2013-06-19T12:24:39.203 に答える
1

請求チップの変数は文字列です。parseFloat()を使用してみてください。2 つの文字列に追加記号 ( + ) を使用すると、単純にそれらが連結されます。

var bill = parseFloat($('#bill').val());
var tip = parseFloat($('#tip').val());
于 2013-06-19T12:21:05.283 に答える
1

あるケースではparseInt()を使用しましたが、同様の状況で同じパスをたどらなかったのはなぜですか?

とにかく、これが私があなたのコードをどのように修正したかです:

$(document).ready(function () {

$('input#bill, input#tip').blur(function () {
    var num = parseFloat($(this).val());
    if (isNaN(num)) {
        return;
    }
    var cleanNum = num.toFixed(2);
    $(this).val(cleanNum);
    if (num / cleanNum < 1) {}
});

$('#people, #bill, #tip').keyup(function () {
    updateTotal();
});



var updateTotal = function () {
    var people = parseInt($('#people').val());
    if (isNaN(people) || people === 0) {
        return;
    }
    var bill = parseFloat($('#bill').val());
    if (isNaN(bill)) {
        bill = 0;
    }
    var tip = parseFloat($('#tip').val());
    if (isNaN(tip)) {
        tip = 0;
    }
    var billTip = bill + tip;
    var billTipPeople = billTip / people;

    $('#total').text("£" + billTipPeople);
    // round up to 2 d.p. like below:
    // $('#total').text("£" + billTipPeople.toFixed(2));
};

});

もう一度戻ってきて、アプリが別のクレイジーな動作をすることにした理由を尋ねるのを防ぐために、次のチェックを追加しました。

ユーザーが人数を入力すると、請求書の合計金額を入力する準備ができていないにもかかわらず、NaN として更新されます。この厄介な動作を防止するには...

if (isNaN(num)) {
    return;
}

updateTotal()関数でも同じ予防措置を講じます。さらに、0 による除算に注意してください!*私はガールフレンドと一緒にいるときにのみヒントを提供します。そうしないと、私のような人がアプリを壊してしまいます...

if (isNaN(people) || people === 0) {
    return;
}

これがフィドルです>> http://jsfiddle.net/a8eJT/11/

于 2013-06-19T13:00:44.803 に答える
0

parseInt()andを javascript で使用してみてくださいparseFloat()。これらを使用せずに実行すると、文字列として扱われます。

于 2013-06-19T12:21:17.083 に答える
0

試す

var updateTotal = function () {
      var people = parseInt($('#people').val());
      var bill = parseInt($('#bill').val());
      var tip = parseInt($('#tip').val());
      var billTip = bill + tip;
      var billTipPeople = billTip / people;

      $('#total').text("£" + billTipPeople) 

parseint を両方に追加しましたbill&tip

于 2013-06-19T12:23:55.907 に答える