<input class="addBtn min" type="button" value="-" />
<input class="join-money" type="text" value="1">
<input class="addBtn add" type="button" value="+" />
<span class="total">¥<span class="allMoney">10000</span></span>
<p class="money-tip">(每份金額10000元)</p>
js:
var t = $(".join-money");
var m = $(".allMoney").text();
var mm = $(".allMoney");
function updateMoney(){
var tt = t.val();
var total = m*tt; //輸入框中的份額數與每份金額數相乘得到總金額
mm.text(total);
if(t.val()<=0){
mm.text(m);
}
}
$(function(){
$(".add").click(function() {
t.val(parseInt(t.val()) + 1); //點擊加號輸入框數值加1
updateMoney(); //顯示總金額
});
$(".min").click(function(){
t.val(parseInt(t.val())-1); //點擊減號輸入框數值減1
if(t.val()<=0){
t.val(parseInt(t.val())+1); //最小值為1
}
updateMoney();
});
$(".join-money").keyup(function(){
var c=$(this);
if(/[^\d]/.test(c.val())){//替換非數字字符
var amount=c.val().replace(/[^\d]/g,'');
$(this).val(amount);
}
updateMoney(); //手動輸入數值金額隨之改變
});
});