大家好,今天给大家介绍一款,jquery实现的金融行业款项预算表单页面源码(图1)。送给大家哦,获取方式在本文末尾。
图1
根据用户选择自动调整显示金额(图2)
![](https://i-blog.csdnimg.cn/blog_migrate/ee6ae8ddfbe65056414948a134e89776.gif)
图2
本源码编码:10140,需要的朋友,点击下面的链接后,搜索10140,即可获取。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>出借金额以及出借期限jquery选择</title>
<link href="static/css/style.css" rel="stylesheet" type="text/css">
<script src="static/js/jquery-1.10.2.js"></script>
</head>
<body>
<div class="box-content">
<div class="box-content-box">
<div class="box-header">
出借<span id="moneyValue">23.9万</span>元,<span id="dateValue">90</span>天项目,利息约为:<span id="profit">4007.34</span>元
</div>
<div class="box-header-tag"></div>
<div class="box-amount">
<div class="box-head-title">出借金额</div>
<div class="box-amount-item">
<span class="span-point box-spacing" id="box-circle">
<img src="static/picture/spotRed.png">
</span>
<div class="money-value-pos">
<input type="radio" value="1000" name="mv" id="mv1">
<label for="mv1">1000元</label>
<div class="bubble">直投项目起投金额 1000元</div>
</div>
<div class="money-value-pos">
<input type="radio" value="5000" name="mv" id="mv2">
<label for="mv2">5000元</label>
<div class="bubble">少数用户首次出借5千元</div>
</div>
<div class="money-value-pos">
<input type="radio" value="10000" name="mv" id="mv3">
<label for="mv3">1万元</label>
<div class="bubble">多数用户首次出借1万元</div>
</div>
<div class="money-value-pos">
<input type="radio" value="50000" name="mv" id="mv4">
<label for="mv4">5万元</label>
<div class="bubble">20%单笔出借额约5万元</div>
</div>
<div class="money-value-pos">
<input type="radio" value="100000" name="mv" id="mv5">
<label for="mv5">10万元</label>
<div class="bubble">15%单笔出借额约10万元</div>
</div>
<div class="money-value-pos">
<input type="radio" value="239000" name="mv" id="mv6" checked="">
<label for="mv6">23.9万元</label>
<div class="bubble" style="display: block;">人均出借金额为23.9万元</div>
</div>
<div class="money-value-pos" style="margin: 0;">
<input type="radio" value="500000" name="mv" id="mv7">
<label for="mv7">50万元</label>
<div class="bubble">VIP单笔出借额约50万元</div>
</div>
</div>
</div>
<div class="investDate box-term">
<div class="box-head-title">出借期限</div>
<div class="date-value">
<span class="span-point" id="box-circle-two">
<img src="static/picture/spotRed.png">
</span>
<div class="date-value-pos">
<input type="radio" value="21" name="itd" id="itd1">
<label for="itd1">21天</label>
<div class="bubble">新手体验项目 21天,6%+4%</div>
</div>
<div class="date-value-pos">
<input type="radio" value="30" name="itd" id="itd2">
<label for="itd2">30天</label>
<div class="bubble">每月定存,轻松理财 30天,6.3%</div>
</div>
<div class="date-value-pos">
<input type="radio" value="90" name="itd" id="itd3" checked="">
<label for="itd3">90天</label>
<div class="bubble" style="display: block;">明星产品人气爆款 90天,6.8%</div>
</div>
<div class="date-value-pos">
<input type="radio" value="180" name="itd" id="itd4">
<label for="itd4">180天</label>
<div class="bubble">半年定存理财 180天,7%</div>
</div>
<div class="date-value-pos">
<input type="radio" value="270" name="itd" id="itd5">
<label for="itd5">270天</label>
<div class="bubble">资金周转理财 270天,7.5%</div>
</div>
<div class="date-value-pos" style="margin: 0;">
<input type="radio" value="365" name="itd" id="itd6">
<label for="itd6">365天</label>
<div class="bubble">收益Top,壕友偏爱 365天,7.8%</div>
</div>
</div>
</div>
<div class="box-button">提交订单</div>
</div>
</div>
<script type="text/javascript" src="static/js/script.js"></script> <!-- 先执行html 再执行jquery -->
</body>
</html>