관리 메뉴

Crispfeel

경유(디젤)차량 환경개선부담금 계산 본문

Javascript

경유(디젤)차량 환경개선부담금 계산

Crispfeel 2019. 7. 4. 12:20

경유(디젤)차량 환경개선부담금 계산기 소스 입니다.
경유차량 알아보다가 궁금해서 찾아보는데 저처럼 계산하기 귀찮으신분들 있을것 같아 간단하게 만들어봤습니다.
부과금산정지수는 작년기준으로 기본값을 넣어놨고...내년에 생각나면 2018년도 값으로 업데이트 할께요^^
(환경개선부담금은 후불로 2017기준 계산)

 

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="UTF-8">
    <title>경유차 환경개선부담금 계산기</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <style type="text/css">
      body, html, h1, h2, h3, h4, p, ul, ol, li, dl, dt, dd, input, select {padding:0;margin:0;font-size:.95em;}
      img {border:0;}
      a {text-decoration:none;}
      table {border-spacing:0;padding:0;border-top:1px solid #ddd;border-left:1px solid #ddd;width:100%;}
      td, th {border-right:1px solid #ddd;border-bottom:1px solid #ddd;padding:3px;}
      th {background-color:#f5f5f5;text-align:left;}
      #inputVal th {background-color:#f5e7ed}
      input[type=text] {height:20px;line-height:20px;}
      input[type=button] {border:1px solid #222;background-color:#444;color:#fff;line-height:22px;display:block;width:200px;margin:10px auto;text-align:center;}
      select {height:22px;line-height:20px;}
      #inputVal, #resultVal {width:100%;margin:0 auto;}
      #resultVal {max-height:250px;overflow-y:auto;border-bottom:1px solid #ddd;}
      #resultTxt {display:none;}
    </style>
    <script type="text/javascript">
      $(function(){
        $("#calTax").on("click",function(){
          var v1 = parseFloat($("#v1").val());
          var v2 = parseFloat($("#v2").val());
          var v3 = parseFloat($("#v3").val());
          var v4 = parseFloat($("#v4").val());
          var v5 = parseFloat($("#v5").val());
          $("#money").html(parseInt(v1*v2*v3*v4*v5));
          $("#v1m").html(v1);
          $("#v2m").html(v2);
          $("#v3m").html(v3);
          $("#v4m").html(v4);
          $("#v5m").html(v5);
          $("#resultTxt").show();
        })
      });
    </script>
  </head>
  <body>
    <div id="inputVal">
      <table>
        <colgroup>
          <col width="200" />
          <col width="*" />
        </colgroup>
        <tr>
          <th>①기준부과금액</th>
          <td><input type="text" id="v1" value="20250" /></td>
        </tr>
        <tr>
          <th>②부과금산정지수(2017)</th>
          <td><input type="text" id="v2" value="1.959" /></td>
        </tr>
        <tr>
          <th>③차량선택(오염유발계수)</th>
          <td>
            <select name="" id="v3">
              <option value="1">2,000cc 이하</option>
              <option value="1.25">2,500cc 이하</option>
              <option value="1.75">3,500cc 이하</option>
              <option value="2.64">6,500cc 이하</option>
              <option value="4.5">10,000cc 이하</option>
              <option value="5">10,000cc 초과</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>④연식선택(차량계수)</th>
          <td>
            <select name="" id="v4">
              <option value="1">1년미만</option>
              <option value="1.02">2년미만</option>
              <option value="1.04">3년미만</option>
              <option value="1.06">4년미만</option>
              <option value="1.08">5년미만</option>
              <option value="1.1">6년미만</option>
              <option value="1.12">7년미만</option>
              <option value="1.14">8년미만</option>
              <option value="1.16">8년이상</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>⑤차량등록지선택(지역계수)</th>
          <td>
            <select name="" id="v5">
              <option value="0.4">인구10만미만</option>
              <option value="0.85">인구10만이상 50만미만</option>
              <option value="0.87">인구50만이상 100만미만</option>
              <option value="1">인구100만이상 500만미만</option>
              <option value="1.53">인구 500만이상</option>
            </select>
          </td>
        </tr>
      </table>
      <input type="button" value="경유차 환경개선부담금 계산" id="calTax" />
    </div>
    <div id="resultVal">
      <table>
        <colgroup>
          <col width="200" />
          <col width="*" />
        </colgroup>
        <tbody>
          <tr>
            <th>부담금 예상금액</th>
            <td>
              <div id="resultTxt">
              <strong><span id="money"></span>원</strong>
              ( <span id="v1m"></span> X <span id="v2m"></span> X <span id="v3m"></span> X <span id="v4m"></span> X <span id="v5m"></span> )
              </div>
            </td>
          </tr>
        </tbody>    
      </table>
    </div>
  </body>
</html>