我是js/jQuery的新手。原諒這個可怕的劇本。我迷路了。jQuery/js - 根據狀態和數量選擇選項計算稅額，小計和總計

*（與全局變量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>

來源

2012-04-05 chasemb

一個大問題，我在這裏看到的是你的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); 
});

這樣，無論您需要它，它都可以使用。

更新

如在申報單沒有顯示內容，不使用

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

它不會爲兩個不同的原因有：第一：.value = ...（.val(...) jQuery中）是原生javascript，並且不會在jQuery對象中工作
秒：值是輸入和選擇控件的屬性，您必須設置.innerText（.text() in jQuery）和.innerHTML（.html() jQuery中）

使用：

$('.quantityselected').html(quant); 
...

來源

2012-04-05 17:19:50

我按照Steve和Andrzej的建議嘗試過，但是，我的所有div仍然是空白的。我已經檢查了Chrome中的腳本，它正在傳遞。 – chasemb 2012-04-05 17:26:12

沒有問題，我查看了頁面的源代碼，並且無處找到函數doMath（）被調用。你什麼時候想更新div？關於國家的變化？ – 2012-04-05 17:54:03

我希望div的更新時a）。選擇的州是愛達荷州和b）。他們將1的初始數量更改爲其他值，並在屏幕上反映這些更改。就像我說的，我是js的超級新手...... :( – chasemb 2012-04-05 17:58:02

你的問題很可能是範圍之一。

由於您在狀態更改函數的閉包中聲明變量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或類似的恕我直言更清楚，因爲目前我認爲它可能與數額的稅款到期相混淆，特別是當使用與price和shipping相同的上下文。）

來源

2012-04-05 17:16:58

嗯。我做了更改，但沒有在屏幕上顯示。所有的div都是空白的... – chasemb 2012-04-05 17:22:18

好吧，我會看到代碼的其餘部分 – 2012-04-05 17:28:19

我已經做了上述更新。 – chasemb 2012-04-05 17:29:47

文檔就緒函數中聲明的變量「iftax」對於該函數是本地的。在doMath函數中引用的iftax會查看全局作用域（window.iftax），我猜這是未定義的。

儘管使用全局變量有點反模式，但如果從文檔就緒函數（當前寫入「var iftax」的地方）中的所有位置刪除「var」，它將默認爲全局變量和你的代碼應該工作。

來源

2012-04-05 17:17:37

jQuery/js - 根據狀態和數量選擇選項計算稅額，小計和總計

回答

更新

相關問題