PCB javascript实现个税5000计算
Posted pcbren
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了PCB javascript实现个税5000计算相关的知识，希望对你有一定的参考价值。
个税调整为5000计划实施是今年10月份.而明年一月份全面实施，
马上快到5000个税实施的日子了，当到了个税实施日子时，必定网络会产生热点，这个时候需要就是蹭热点的时候到来时。
全国网友肯定都会关心个税问题。这是必定的，关心哪些问题呢，脑子里面有浮现了网友想要知道的问题点了，
这里罗列网友可能关心的问题：个税如何计算，扣费了哪些内容，扣了多少，改税后与改税前实际个税对比;到手工资差异多少。
这些问题如何帮忙他们解决了，那就是提前准备好，在这里准用javascript写一个税5000的计算工具网页版来解决个税的所有凝问。
由于工作忙的原因，尽量下班后腾出时间，将此博文内容填完整。
一.可能有人会问，为会产生热点呢，
本人也是经历过2011年税改的，作为百度文库众多文档供献者之一，供献了323个文档，通过后台大量数据分析，阅读量，下载量，质量评分
综合统计得出<个人所得税速算表> 文档 在当时2011年不管是阅读量，还是下载量，远高于其它文档的，2011是个税改革年，可见热度是如此高
由此产生的积分之高到目前为止都没用完。。如果哪位有需要的下载文库的可以联系我, 这边将免费提供文档下载（QQ:254566449）
二.3500扣税的计算javascript实现代码
这里将3500的个税计算方法列出来，为什么 呢，因为5000个税是在此基础上改进的呀。有了对比让人看了更明白.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> <script type="text/javascript"> document.title="个税计算器"; //写头部内容。 var header=document.createElement("header"); header.innerHTML="个税计算器"; document.body.appendChild(header); header.style.backgroundColor="blue"; header.style.height="50px"; header.style.textAlign="center"; header.style.fontSize="30px"; header.style.lineHeight="50px"; header.style.color="white"; //写输入框。 var form=document.createElement("form"); document.body.appendChild(form); var input1=document.createElement("input"); form.appendChild(input1); input1.type="text"; input1.placeholder="基本工资"; input1.style.width="100%"; input1.style.height="40px"; input1.style.marginTop="15px"; input1.style.fontSize="30px"; input1.innerHTML.placeholder="基本工资/计税"; var input2=document.createElement("input"); form.appendChild(input2); input2.type="text"; input2.placeholder="绩效工资及工龄工资"; input2.style.width="100%"; input2.style.height="40px"; input2.style.marginTop="15px"; input2.style.fontSize="30px"; input2.style.placeholder="绩效工资/计税"; var input3=document.createElement("input"); form.appendChild(input3); input3.type="text"; input3.placeholder="奖金及其它收入"; input3.style.width="100%"; input3.style.height="40px"; input3.style.marginTop="10px"; input3.style.fontSize="30px"; input3.style.placeholder="奖金/计税"; //写计算按钮 var button=document.createElement("button"); document.body.appendChild(button); button.innerHTML="开始计算"; button.style.backgroundColor="lightskyblue"; button.style.textAlign="center"; button.style.fontSize="30px"; button.style.height="50px"; button.style.width="100%"; button.style.margin="10px auto"; // button.style.margin="" //写主题内容 //定义一个主体区域用于存放主体内容。 var sec=document.createElement("section"); document.body.appendChild(sec); //工资总额部分 var dl=document.createElement("dl"); sec.appendChild(dl); var dt=document.createElement("dt"); dl.appendChild(dt); dt.innerHTML="工资总额"; var dd=document.createElement("dd"); dl.appendChild(dd); dd.innerHTML="0.00"; dt.style.float="left"; dd.style.float="right"; dl.style.marginTop="15px"; dl.style.marginBottom="5px"; dl.style.height="30px"; dt.style.height="30px"; dt.style.fontSize="24px"; dd.style.fontSize="24px"; //写分割线 var hr=document.createElement("hr"); sec.appendChild(hr); hr.style.margin="0"; //写养老部分8% var dl1=document.createElement("dl"); sec.appendChild(dl1); var dt1=document.createElement("dt"); dl1.appendChild(dt1); dt1.innerHTML="养老保险 8%"; var dd1=document.createElement("dd"); dl1.appendChild(dd1); dd1.innerHTML="-0.00"; dt1.style.float="left"; dd1.style.float="right"; dl1.style.marginTop="15px"; dl1.style.marginBottom="5px"; dl1.style.height="30px"; dt1.style.height="30px"; dt1.style.fontSize="24px"; dt1.style.color="red"; dd1.style.fontSize="24px"; dd1.style.color="red"; //写医疗 2%部分 var dl2=document.createElement("dl"); sec.appendChild(dl2); var dt2=document.createElement("dt"); dl2.appendChild(dt2); dt2.innerHTML="医疗保险 2%"; var dd2=document.createElement("dd"); dl2.appendChild(dd2); dd2.innerHTML="-0.00"; dt2.style.float="left"; dd2.style.float="right"; dl2.style.marginTop="15px"; dl2.style.marginBottom="5px"; dl2.style.height="30px"; dt2.style.height="30px"; dt2.style.fontSize="24px"; dt2.style.color="red"; dd2.style.fontSize="24px"; dd2.style.color="red"; //写失业保险1% var dl3=document.createElement("dl"); sec.appendChild(dl3); var dt3=document.createElement("dt"); dl3.appendChild(dt3); dt3.innerHTML="失业保险 1%"; var dd3=document.createElement("dd"); dl3.appendChild(dd3); dd3.innerHTML="-0.00"; dt3.style.float="left"; dd3.style.float="right"; dl3.style.marginTop="15px"; dl3.style.marginBottom="5px"; dl3.style.height="30px"; dt3.style.height="30px"; dt3.style.fontSize="24px"; dt3.style.color="red"; dd3.style.fontSize="24px"; dd3.style.color="red"; //写工伤保险0% var dl4=document.createElement("dl"); sec.appendChild(dl4); var dt4=document.createElement("dt"); dl4.appendChild(dt4); dt4.innerHTML="工伤保险 0%"; var dd4=document.createElement("dd"); dl4.appendChild(dd4); dd4.innerHTML="-0.00"; dt4.style.float="left"; dd4.style.float="right"; dl4.style.marginTop="15px"; dl4.style.marginBottom="5px"; dl4.style.height="30px"; dt4.style.height="30px"; dt4.style.fontSize="24px"; dt4.style.color="red"; dd4.style.fontSize="24px"; dd4.style.color="red"; //写生育保险0% var dl5=document.createElement("dl"); sec.appendChild(dl5); var dt5=document.createElement("dt"); dl5.appendChild(dt5); dt5.innerHTML="生育保险 0%"; var dd5=document.createElement("dd"); dl5.appendChild(dd5); dd5.innerHTML="-0.00"; dt5.style.float="left"; dd5.style.float="right"; dl5.style.marginTop="15px"; dl5.style.marginBottom="5px"; dl5.style.height="30px"; dt5.style.height="30px"; dt5.style.fontSize="24px"; dt5.style.color="red"; dd5.style.fontSize="24px"; dd5.style.color="red"; //写住房公积金8% var dl6=document.createElement("dl"); sec.appendChild(dl6); var dt6=document.createElement("dt"); dl6.appendChild(dt6); dt6.innerHTML="住房公积金 8%"; var dd6=document.createElement("dd"); dl6.appendChild(dd6); dd6.innerHTML="-0.00"; dt6.style.float="left"; dd6.style.float="right"; dl6.style.marginTop="15px"; dl6.style.marginBottom="5px"; dl6.style.height="30px"; dt6.style.height="30px"; dt6.style.fontSize="24px"; dt6.style.color="red"; dd6.style.fontSize="24px"; dd6.style.color="red"; //写分割线 var hr=document.createElement("hr"); sec.appendChild(hr); hr.style.margin="0"; //写计税工资 var dl7=document.createElement("dl"); sec.appendChild(dl7); var dt7=document.createElement("dt"); dl7.appendChild(dt7); dt7.innerHTML="计税工资"; var dd7=document.createElement("dd"); dl7.appendChild(dd7); dd7.innerHTML="0.00"; dt7.style.float="left"; dd7.style.float="right"; dl7.style.marginTop="15px"; dl7.style.marginBottom="5px"; dl7.style.height="30px"; dt7.style.height="30px"; dt7.style.fontSize="24px"; dd7.style.fontSize="24px"; //写个人所得税 var dl8=document.createElement("dl"); sec.appendChild(dl8); var dt8=document.createElement("dt"); dl8.appendChild(dt8); dt8.innerHTML="个人所得税"; var dd8=document.createElement("dd"); dl8.appendChild(dd8); dd8.innerHTML="-0.00"; dt8.style.float="left"; dd8.style.float="right"; dl8.style.marginTop="15px"; dl8.style.marginBottom="5px"; dl8.style.height="30px"; dt8.style.height="30px"; dt8.style.fontSize="24px"; dt8.style.color="red"; dd8.style.fontSize="24px"; dd8.style.color="red"; //写分割线 var hr=document.createElement("hr"); sec.appendChild(hr); hr.style.margin="0"; //写实发工资 var dl9=document.createElement("dl"); sec.appendChild(dl9); var dt9=document.createElement("dt"); dl9.appendChild(dt9); dt9.innerHTML="实发工资"; var dd9=document.createElement("dd"); dl9.appendChild(dd9); dd9.innerHTML="0.00"; dt9.style.float="left"; dd9.style.float="right"; dl9.style.marginTop="15px"; dl9.style.marginBottom="5px"; dl9.style.height="30px"; dt9.style.height="30px"; dt9.style.fontSize="24px"; dt9.style.fontWeight="bold"; dd9.style.fontSize="24px"; dd9.style.fontWeight="bold"; /******************************************************************************/ //写数据交互部分。 //填写数据时隐藏五险一金部分。 form.onclick=function(){ sec.style.display="none"; } //为button添加监听事件 button.addEventListener("click",js); //封装一个函数进行计算 function js(){ sec.style.display="block"; //从输入框中拿去数值。 var n1=input1.value; // alert(n1); var n2=input2.value; var n3=input3.value; //把从输入框中拿来的数据进行过滤（转换为纯数字） n1=parseFloat(n1); n2=parseFloat(n2); n3=parseFloat(n3); //判断输入框中的内容是否合适 if(isNaN(n1+n2+n3)){ alert("输入的工资不符合要求，请输入纯数字！"); return; } //计算总额。 var all=n1+n2+n3; var yanglao=0.08*all; var yiliao = 0.02 * all; var shiye = 0.01 * all; var gongshang = 0 * all; var shengyu = 0 * all; var gongjijin = 0.08 * all; var tongchou = 0; //将计算的五险一金内容写进表格 //工资总收入。 dd.innerHTML=all.toFixed(2); //计算结果保留2位小数。 //养老保险扣除部分。 dd1.innerHTML="-"+yanglao.toFixed(2); //医疗保险扣除部分。 dd2.innerHTML="-"+yiliao.toFixed(2); //失业保险扣除部分。 dd3.innerHTML="-"+shiye.toFixed(2); //工伤保险扣除部分。 dd4.innerHTML="-"+gongshang.toFixed(2); //生育保险扣除部分。 dd5.innerHTML="-"+shengyu.toFixed(2); //住房公积金扣除部分。 dd6.innerHTML="-"+gongjijin.toFixed(2); //计算计税工资=总额 - 五险一金 - 3500 var jishui=all-0.19*all-3500; dd7.innerHTML=jishui.toFixed(2); var shifa; var shui; //计算交税工资及实发工资。 if(jishui<=0){ alert("您的收入达不到税收要求。"); } else if(0 <jishui &&jishui <= 1500){ shui = 0.03 * jishui - 0; } else if(1500 <jishui &&jishui <= 4500){ shui = 0.1 * jishui - 105; } else if(4500 <jishui &&jishui <= 9000){ shui = 0.2 * jishui - 555; } else if(9000 <jishui &&jishui <= 35000){ shui = 0.25 * jishui - 1005; } else if(35000 <jishui &&jishui <= 55000){ shui = 0.3 * jishui - 2755; } else if(55000 <jishui &&jishui <= 80000){ shui = 0.35 * jishui - 5505; } else{ shui = 0.45 * jishui - 13505; } dd8.innerHTML="-"+shui.toFixed(2); shifa = all - shui - 0.19 * all; dd9.innerHTML=shifa.toFixed(2); } </script> </html>
三.5000扣税的计算javascript实现代码
js代码 :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=emulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta charset="utf-8">
<link rel="stylesheet" href="./common/css/sapar.css" />
<script src="https://cdn.bootcss.com/vue/2.4.2/vue.min.js"></script>
<title>最新版个税计算器</title>
</head>
<body >
<div id="saper-container">
<div><h1 style="font-size: 24px;text-align: center;color: #053cfb;">最新版个税计算器(起征点5000)</h1> </div>
<div id="saper-bd">
<div class="subfiled clearfix">
<h2>税前工资信息录入</h2>
</div>
<div class="subfiled-content">
<form class="saper-form">
<div class="kv-item clearfix">
<label>税前工资：</label>
<div class="kv-item-content">
<input type="text" placeholder="税前工资" v-model="gongz">
</div>
</div>
<div class="kv-item clearfix">
<label>五险一金：</label>
<div class="kv-item-content">
<input type="text" placeholder="五险一金" v-model="wuxianyijin">
</div>
</div>
</form>
</div>
<div style="clear: both;">
<div style="float: left;width: 50%;">
<div class="subfiled clearfix" style="border: 1px solid #C1D3DE;">
<h2>个税5000计算结果</h2>
</div>
<div class="subfiled-content" style="border: 1px solid #C1D3DE;">
<form class="saper-form">
<div class="kv-item clearfix">
<label>应纳税所得额：</label>
<div class="kv-item-content">
<input type="text" placeholder="应纳税所得额" v-model="gongz1">
</div>
</div>
<div class="kv-item clearfix">
<label>应纳税额：</label>
<div class="kv-item-content">
<input type="text" placeholder="应纳税额" v-model="jishuiCalc1">
</div>
</div>
<div class="kv-item clearfix">
<label>税后工资：</label>
<div class="kv-item-content">
<input type="text" placeholder="税后工资" v-model="gongz2" >
</div>
</div>
</form>
</div>
</div>
<div style="float: left;width: 50%;">
<div class="subfiled clearfix" style="border: 1px solid #C1D3DE;">
<h2>个税3500计算结果</h2>
</div>
<div class="subfiled-content" style="border: 1px solid #C1D3DE;">
<form class="saper-form">
<div class="kv-item clearfix">
<label>应纳税所得额：</label>
<div class="kv-item-content">
<input type="text" placeholder="应纳税所得额" v-model="gongz11" >
</div>
</div>
<div class="kv-item clearfix">
<label>应纳税额：</label>
<div class="kv-item-content">
<input type="text" placeholder="应纳税额" v-model="jishuiCalc11">
</div>
</div>
<div class="kv-item clearfix">
<label>税后工资：</label>
<div class="kv-item-content">
<input type="text" placeholder="税后工资" v-model="gongz22" >
</div>
</div>
</form>
</div>
</div>
</div>
<div>
<h1 style=\'color: red;font-size: 18px;\'>新个税执行：每个月个税少交:{{(gongz2-gongz22).toFixed(2)}}元,一年下来可以节省{{((gongz2-gongz22)*12).toFixed(2)}}元哦!!!</h1>
</div>
<div class="subfiled clearfix">
<h2>起征点5000个税计算详解</h2>
</div>
<div id="calcDetail1">
<h1>5000起征点 税前工资10,000元 五险一金0元 缴纳个税290元</h1>
<div>税前工资 10,000</div>
<div>五险一金 0</div>
<div> 起征点 5,000</div>
<br>
<div>应纳税所得额 = 税前工资 －五险一金 － 起征点</div>
<div>= 10,000 －0 － 5,000</div>
<div>= 5,000</div>
<br>
<div>应纳税所得额 5,000，参照税率表，得到税率 10%，速算扣除数 210</div>
<!--表格开始-->
<div class="table">
<!--表格具体内容-->
<div class="table-box">
<table>
<thead>
<tr>
<th>级数</th>
<th>应纳税所得额</th>
<th>税率</th>
<th>速算扣除数</th>
</tr>
</thead>
<tbody>
<tr>
<td> 1</td>
<td>(0＜X≤3,000)</td>
<td>3% </td>
<td>0</td>
</tr>
<tr>
<td>2</td>
<td>(3,000＜X≤12,000)</td>
<td>10%</td>
<td>210</td>
</tr>
<tr>
<td>3</td>
<td>(12,000＜X≤25,000)</td>
<td>20%</td>
<td>1410</td>
</tr>
<tr>
<td> 4</td>
<td>(25,000＜X≤35,000)</td>
<td>25%</td>
<td>2,660</td>
</tr>
<tr>
<td>5</td>
<td>(35,000＜X≤55,000)</td>
<td>30%</td>
<td>4,410</td>
</tr>
<tr>
<td>6</td>
<td>(55,000＜X≤80,000)</td>
<td>35%</td>
<td>7,160</td>
</tr>
<tr>
<td>7</td>
<td>(X＞80,000)</td>
<td>45%</td>
<td>15,160</td>
</tr>
</tbody>
</table>
</div>
</div>
<div>应纳税额 = 应纳税所得额 × 税率 － 速算扣除数</div>
<div>= 5,000 × 10% － 210</div>
<div>= 290</div>
<br>
<div>税后工资 = 税前工资 － 五险一金 － 应纳个税</div>
<div>= 10,000 － 0 － 290</div>
<div>= 9,710</div>
</div>
<div class="subfiled clearfix">
<h2>起征点3500个税计算详解</h2>
</div>
<div id="calcDetail2">
<h1>3500起征点 税前工资10,000元 五险一金0元 缴纳个税745元</h1>
<div>税前工资 10,000</div>
<div>五险一金 0</div>
<div> 起征点 3,500</div>
<br>
<div>应纳税所得额 = 税前工资 －五险一金 － 起征点</div>
<div>= 10,000 －0 － 3,500</div>
<div>= 6,500</div>
<br>
<div>应纳税所得额 6,500，参照税率表，得到税率 20%，速算扣除数 555</div>
<!--表格开始-->
<div class="table">
<!--表格具体内容-->
<div class="table-box">
<table>
<thead>
<tr>
<th>级数</th>
<th>应纳税所得额</th>
<th>税率</th>
<th>速算扣除数</th>
</tr>
</thead>
<tr>
<td> 1</td>
<td>(0＜X≤1,500)</td>
<td>3% </td>
<td>0</td>
</tr>
<tr>
<td>2</td>
<td>(1,500＜X≤4,500)</td>
<td>10%</td>
<td>105</td>
</tr>
<tr>
<td>3</td>
<td>(4,500＜X≤9,000)</td>
<td>20%</td>
<td>555</td>
</tr>
<tr>
<td> 4</td>
<td>(9,000＜X≤35,000)</td>
<td>25%</td>
<td>1,005</td>
</tr>
<tr>
<td>5</td>
<td>(35,000＜X≤55,000)</td>
<td>30%</td>
<td>2,755</td>
</tr>
<tr>
<td>6</td>
<td>(55,000＜X≤80,000)</td>
<td>35%</td>
<td>5,505</td>
</tr>
<tr>
<td>7</td>
<td>(X＞80,000)</td>
<td>45%</td>
<td>13,505</td>
</tr>
</tbody>
</table>
</div>
</div>
<div>应纳税额 = 应纳税所得额 × 税率 － 速算扣除数</div>
<div>= 6,500 × 20% － 555</div>
<div>= 745</div>
<br>
<div>税后工资 = 税前工资 － 五险一金 － 应纳个税</div>
<div>= 10,000 － 0 － 745</div>
<div>= 9,255</div>
</div>
</div>
<div id="saper-ft"></div>
<div><h1 style="font-size: 16px;text-align: center;color: #053cfb;">EDS工程开发团队出品 2018</h1> </div>
</div>
<script type="text/javascript">
var vm = new Vue({
el: \'#saper-container\',
data: {
gongz: 10000, //税前工资(扣社保前) 12000
wuxianyijin: 0, //五险一金
gongz1: 0, //应纳税所得额 12000-2000-5000
gongz2: 0, //实发工资
gongz11: 0, //应纳税所得额 12000-2000-3500
gongz22: 0, //实发工资
isReadOnly : true,
},
methods: {},
computed: {
jishuiCalc1: function() {
var jishuied = this.gongz - this.wuxianyijin - 5000;
jishuied = jishuied > 0 ? jishuied : 0;
this.gongz1 = jishuied;
var jishui = this.gongz1;
var shuilu = 0;
var xujian = 0;
//计算交税工资及实发工资。
if(0 < jishui && jishui <= 2910) {
shuilu = 0.03;
xujian = 0;
} else if(2910 < jishui && jishui <= 11010) {
shuilu = 0.1;
xujian = 210;
} else if(11010 < jishui && jishui <= 21410) {
shuilu = 0.2;
xujian = 1410;
} else if(21410 < jishui && jishui <= 28910) {
shuilu = 0.25;
xujian = 2660;
} else if(28910 < jishui && jishui <= 42910) {
shuilu = 0.30;
xujian = 4410;
} else if(42910 < jishui && jishui <= 59160) {
shuilu = 0.35;
xujian = 7160;
} else if(jishui > 59160) {
shuilu = 0.45;
xujian = 15160;
}
jishuied = (shuilu * jishui - xujian).toFixed(2);
this.gongz2 = (this.gongz - this.wuxianyijin - jishuied).toFixed(2);
return jishuied;
},
jishuiCalc11: function() {
var jishuied = this.gongz - this.wuxianyijin - 3500;
jishuied = jishuied > 0 ? jishuied : 0;
this.gongz11 = jishuied;
var jishui = this.gongz11;
var shuilu = 0;
var xujian = 0;
//计算交税工资及实发工资。
if(0 < jishui && jishui <= 1455) {
shuilu = 0.03;
xujian = 0;
} else if(1455 < jishui && jishui <= 4155) {
shuilu = 0.1;
xujian = 105;
} else if(4155 < jishui && jishui <= 7755) {
shuilu = 0.2;
xujian = 555;
} else if(7755 < jishui && jishui <= 27255) {
shuilu = 0.25;
xujian = 1005;
} else if(27255 < jishui && jishui <= 41255) {
shuilu = 0.30;
xujian = 2755;
} else if(41255 < jishui && jishui <= 57505) {
shuilu = 0.35;
xujian = 5505;
} else if(jishui > 57505) {
shuilu = 0.45;
xujian = 13505;
}
jishuied = (shuilu * jishui - xujian).toFixed(2);
this.gongz22 = (this.gongz - this.wuxianyijin - jishuied).toFixed(2);
return jishuied;
}
}
});
</script>
</body>
<!-- <script type="text/javascript"> -->
<!-- $(\'#pagin\').pagination(100,{ -->
<!-- callback: function(page){ -->
<!-- alert(page); -->
<!-- }, -->
<!-- display_msg: true, -->
<!-- setPageNo: true -->
<!-- }); -->
<!--</script>-->
</html>
css代码:
/** Alerts**/ /*clear*/ .clearfix:after { content: "."; display: block; height: 0; clear: both; overflow: hidden; } .clearfix { display: inline-block; } *html .clearfix { height: 1%; } .clearfix { display: block; } .brand-warning { color: #f0ad4e; } .brand-danger { color: #d9534f; } /*! normalize.css v3.0.2 | MIT License | git.io/normalize */ html { font-family: sans-serif;以上是关于PCB javascript实现个税5000计算的主要内容，如果未能解决你的问题，请参考以下文章