用JavaScript计算美国各州的营业税 [英] Calculating Sales Tax for a US State in Javascript

查看:58
本文介绍了用JavaScript计算美国各州的营业税的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

因此,我正在尝试计算项目的营业税,但我无法使其正常工作.不用说,我还在学习javascript.运作方式如下:如果买家选择新泽西州,我想对订单加收7%的营业税.其他任何地方都为零.

So I'm trying to calculate sales tax for a project and I can't get it to work. Needless to say, I'm still learning javascript. Here's how it works: If the buyer selects New Jersey, I want to apply a 7% sales tax to the order. Everywhere else goes to zero.

这里是jsFiddle项目的链接: https://jsfiddle.net/JohnOHFS/hpdnmjfL/

Here's a link to the jsFiddle project: https://jsfiddle.net/JohnOHFS/hpdnmjfL/

这是我的基本表单HTML(跳过开始和结束标记等)

Here's my basic form HTML (skipping the opening and closing tags, etc.)

<div id="public">
                      <div class="row">
                          <div class="col-xs-7 col-md-7">
                              <div class="form-group">
                                  <label for="city">CITY</label>
                                  <input type="text" size="20" autocomplete="off" class="city input-small form-control" placeholder="CITY"/>
                              </div>
                          </div>
                          <div class="col-xs-4 col-md-4">
                              <div class="form-group">
                                  <label for="state">STATE</label>
                                  <select class="form-control" id="state" onChange="taxRate()">
                                      <option value="">N/A</option>
                                      <option value="AK">Alaska</option>
                                      <option value="AL">Alabama</option>
                                      <option value="NH">New Hampshire</option>
                                      <option value="NJ">New Jersey</option>
                                      <option value="NM">New Mexico</option>  
                                    </select>
                              </div>
                          </div>
                      </div>
                      <div class="row">
                          <div class="col-xs-5 col-md-5">
                              <div class="form-group">
                                  <label for="zipCode">ZIP CODE</label>
                                  <input id="zip" type="text" size="6" autocomplete="off" class="zipcode form-control" placeholder="ZIP CODE"/>
                              </div>
                          </div>
                      </div>
                  </div> <!-- Closes Public -->
                    <div class="row">
                        <div class="col-xs-7 col-md-7">
                                <label>ORDER INFORMATION</label>                                                        
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-xs-7 col-md-7 col-md-offset-1">
                                <label>SUBTOTAL: <b>$<span id="order_subtotal">100</span></b></label>                                                           
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-7 col-md-7 col-md-offset-1">
                                <label>TAXES: <b><span id="order_tax" type="text" value=""></span></b></label>                                                                  
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-7 col-md-7 col-md-offset-1">
                                <label>ORDER TOTAL: <b><span id="order_total" type="text" value=""></span></b></label>                                                                  
                        </div>
                    </div>

这是Javascript:

Here's the Javascript:

function taxRate() {
    var tax_rate = .07;
    var order_taxes = 0;
    var subtotal = document.getElementById("order_subtotal").value;
    subtotal = parseInt(subtotal);
    var total = 0;
    var state = document.getElementById("state").value;
    var selection = state.options[state.selectedIndex].value;
    if (selection == 'New Jersey') {
      order_taxes += tax_rate * subtotal;
    } 
    if (selection == 'else') {
    order_taxes = 0;
    }
    if (selection == 'New Jersey') {
    tax_percent = tax_rate * 100;
    } 
    if (selection == 'else') {
    tax_percent = 0;
    }

    var el = document.getElementById('order_tax');
    el.textContent = order_taxes;

    var total = subtotal + order_taxes;
    var el1 = document.getElementById('order_total');
    el1.textContent = total;

}

这是我的问题.
1.我做错了什么? 2.如何从此javascript将tax_percent传递到html中以提交给Stripe?

Here are my questions.
1. What am i doing wrong? 2. How do I pass tax_percent from this javascript into the html for submittal to Stripe?

谢谢!

推荐答案

小提琴的第一个问题是taxRate()函数不是全局函数,因此无法从内联html属性事件处理程序中调用.这是因为默认情况下,JSFiddle将JS包装在onload处理程序中.使用JS设置菜单(位于JS窗口的右上角),将加载类型"更改为不包装"选项之一.

The first problem with your fiddle is that the taxRate() function is not a global function and so it can't be called from an inline html attribute event handler. This is because by default JSFiddle wraps the JS in an onload handler. Use the JS settings menu (from top-right corner of the JS window) to change the "load type" to one of the "no wrap" options.

然后,获取订单总价值会遇到问题,因为您尝试在元素.value为跨度时获取它,因此您需要使用.innerHTML.

Then you've got a problem getting the order total value, because you try to get the element .value when it is a span, so you need to use .innerHTML.

接下来的事情是将您的state变量设置为等于select元素当前选择的 value .因此它将是'NJ''AK'等(或者,如果未选择任何内容,则为空字符串.)因此,当您尝试将selection变量设置为state.options[state.selectedIndex].value时,该变量将不起作用,因为state是一个字符串.针对'NJ'测试您现有的state变量:

The next thing is that your state variable is set equal to the value of the current selection of the select element. So it will be 'NJ', or 'AK', etc. (Or an empty string if nothing is selected.) So when you try to set the selection variable to state.options[state.selectedIndex].value that won't work because state is a string. Test your existing state variable against 'NJ':

if (state == 'NJ')

您还有一个测试if (selection == 'else'),它不会执行任何操作,因为即使您的selection变量起作用,它的值也永远不会是 string 'else'.我认为您只想在其中使用else语句,除了该块实际所做的只是设置order_taxes = 0,并且在声明时已将order_taxes设置为默认值0.因此,您根本不需要这部分.

You also have a test if (selection == 'else') which won't do anything because even if your selection variable worked its value would never be the string 'else'. I think you just want an else statement there, except that what that block actually does is just set order_taxes = 0 and order_taxes has already been set to a default of 0 at the point of declaration. So you don't need that part at all.

然后您将对新泽西州进行另一个if测试,该测试可以与第一个测试结合使用.它将设置一个未声明的tax_percent变量,因此在函数顶部添加一个带有var的声明.

Then you've got another if testing for New Jersey that could be combined with the first one. It's setting a tax_percent variable that isn't declared, so add a declaration for that with var at the top of your function.

此外,由于JS进行浮点数学运算的方式,100 * 0.07出现为7.000000000000001.您可能希望将其四舍五入到美分金额的小数点后两位(在这种情况下将是美分,但是很明显,如果订单总额不是这样的整数,那么您可能会得到一些美分的税).

Also, because of the way JS does floating point maths, 100 * 0.07 comes out to be 7.000000000000001. You probably want to round that off to two decimal places for the cents amount (which in this case would be no cents, but obviously if the order total wasn't such a round number you might get some number of cents in the taxes).

如何从此javascript将tax_percent传递到html中以提交给Stripe?

一种方法是向表单添加隐藏的输入,并从JS设置其值:

One way is to add a hidden input to your form and set its value from JS:

<input type="hidden" id="tax_percent" name="tax_percent">

document.getElementById('tax_percent').value = tax_percent;

将它们放在一起:

function taxRate() {
    var tax_rate = .07;
    var order_taxes = 0;
    var tax_percent = 0;
    var subtotal = document.getElementById("order_subtotal").innerHTML;
    subtotal = parseInt(subtotal);
    var total = 0;
    var state = document.getElementById("state").value;
    if (state === 'NJ') {
      order_taxes += +(tax_rate * subtotal).toFixed(2);
      tax_percent = +(tax_rate * 100).toFixed(2);
    }

    var el = document.getElementById('order_tax');
    el.textContent = order_taxes;

    var total = subtotal + order_taxes;
    var el1 = document.getElementById('order_total');
    el1.textContent = total;
    document.getElementById('tax_percent').value = tax_percent;
}

演示: https://jsfiddle.net/hpdnmjfL/5/

这篇关于用JavaScript计算美国各州的营业税的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆