0

私はjs/jQueryが初めてです。この恐ろしいスクリプトを許してください。道に迷いました。

*(グローバル変数 ifTaxRate で更新されました。)*

顧客が選択した州と注文数量に基づいて税金、小計、合計を計算し、画面に動的に表示しようとしています。

顧客がアイダホ州の場合、6% の売上税率を適用しようとしています.

オプションを選択：

 <select id="state" value="<?php echo $_SESSION['sstate'] ?>" name="state" class="required" >
   <option value="">Select State</option>
   <option value="AK">Alaska</option>
   .
   <option value="ID">Idaho</option>
   .
   .
   <option value="WY">Wyoming</option>
</select>

<select id="orderquantity" name="orderquantity">
   <option value="1">1 Bottle (30 Day Supply)</option>
   .
   .
   <option value="8">8 Bottles (240 Day Supply)</option>
</select>

情報を表示する div:

<div class="quantityselected"></div>
<div class="productprice"></div>
<div class="pricequantity"></div>
<div class="subtotal"></div>
<div class="tax"></div>
<div class="shipping"></div>
<div class="total"></div>

本当に悪いjsの試み:

<script type="text/javascript">
      var ifTaxRate;
      $(document).ready(function() {
          $("#state").change(function() {
            if ($(this).val() == 'ID') {
              ifTaxRate = .06;
            } else {
              ifTaxRate = 0;
            }
          });
        });

      function doMath() {
            var quant = parseInt(document.getElementById('orderquantity').value);
            //change price here
            var price = 69.99;
            var tax = ifTaxRate;
            //change flat shipping cost here
            var shipping = 4.99;
            var subtotal = quant * price;
            var taxtotal = tax * subtotal;
            var total = subtotal + tax;

            $('.quantityselected').value = quant;
            $('.productprice').value = price;
            $('.pricequantity').value = subtotal;
            $('.tax').value = taxtotal;
            $('.shipping').value = shipping;
            $('.total').value = shipping;
        }
</script>
4

3 に答える 3

1

ここで目にする大きな問題の 1 つは、iftax変数がパラメーターとして渡す匿名関数のスコープ内で宣言されている$('state').change();
ことです。グローバル変数として宣言する必要があり、関数内で再宣言しないでください。

var ifTaxRate = 0; //new    
$(document).ready(function() {
   $("#state").change(function() {
      if ($(this).val() == 'ID') {
         ifTaxRate = .06;
      } else {
         ifTaxRate = 0;
      }
      doMath();//new
   });
   //this way every time you change a select box value, doMath() is called
   $('select').change(doMath);
});

このようにして、必要な場所にいつでもアクセスできます...

アップデート

divに表示されないコンテンツについては、使用しないでください

$('.quantityselected').value = quant;

2 つの異なる理由で機能しません: 1 つ目: .value = ...( .val(...)jQuery の場合) はネイティブの JavaScript であり、jQuery オブジェクトでは機能しません
2 つ目: 値は入力コントロールと選択コントロールのプロパティであり、div を設定する必要があります.innerText( .text()jQuery の場合)および.innerHTML( .html()jQuery で)

使用する：

$('.quantityselected').html(quant);
...
于 2012-04-05T17:19:50.270 に答える
0

あなたの問題はスコープの1つである可能性があります。

iftax状態変更関数のクロージャー内で変数を宣言しているため、doMathメソッドからは見えません。

内部では、最上位レベルで変数を宣言し、状態変更関数から単に代入する必要があります。

<script type="text/javascript">
  var iftax;

  $(document).ready(function() {
      $("#state").change(function() {
        if ($(this).val() == 'ID') {
          iftax = .06;
        } else {
          iftax = 0;
        }
      });
    });

    // rest as before

（まったく別のトピックでは、変数または類似のものを呼び出す方が明確になります。現時点では、特におよび と同じコンテキストで使用された場合に、納税額ifTaxRateと混同される可能性があると思うからです。）priceshipping

于 2012-04-05T17:16:58.310 に答える
0

ドキュメント準備完了関数で宣言された変数「iftax」は、その関数に対してローカルです。doMath 関数で参照される iftax は、グローバル スコープ (window.iftax) を調べますが、それは未定義であると推測しています。

グローバル変数の使用は少しアンチパターンですが、ドキュメントの準備が整った関数のすべての場所 (現在「var iftax」と書かれている場所) から「var」を削除すると、デフォルトでグローバル変数になり、コードが機能するはずです。

于 2012-04-05T17:17:37.890 に答える