前端開發(fā)之便利店收銀系統(tǒng)代碼
1+X前端初級JQ
社區(qū)便利店收銀系統(tǒng)代碼

<body> <input type="text" id="t" value="" disabled="disabled" /> <form id="main" action="" method=""> <span>4.5</span> <input type="button" onclick="addClick(4.5)" value="+" /><br> <span>15</span> <input type="button" onclick="addClick(15)" value="+" /><br> <span>5</span> <input type="button" onclick="addClick(5)" value="+" /><br> </form> <input type="button" name="" id="JZ" value="結(jié)賬" onclick="sub()" /> <input type="button" name="" id="wanc" value="交易完成" onclick="reload()" /> </body>
addClick = (price) => {
let result = $('#t').val(); //從表單里面獲取value值
if (result == "") { //如果為空
$('#t').val(price); //把值輸入到#t(顯示框)
} else {
$('#t').val(result + "+" + price); //不為空就在value后面加一個+鏈接price
}
}
sub = () => {
let result = $('#t').val();
// let a = [];
let sum = 0;
if (result != "") {
var count = result.split('+'); //count是以一個以+號切割的數(shù)組對象
for (let i = 0; i < count.length; i++) {
sum += parseFloat(count[i]); //取出來,取值
}
$('#t').val("總金額:" + sum);
disableBtn();
transparency();
}
}
disableBtn = () => {
$('#JZ').attr('disabled', 'disabled');
}
transparency = () => {
$("#main").css("transition","all 1s");
$("#main").css("opacity","0.3");
}
reload=()=>{
location.reload();
}
總結(jié)
以上所述是小編給大家介紹的前端開發(fā)之便利店收銀系統(tǒng)代碼,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
如果你覺得本文對你有幫助,歡迎轉(zhuǎn)載,煩請注明出處,謝謝!
相關(guān)文章
OpenLayer實(shí)現(xiàn)自定義坐標(biāo)點(diǎn)的繪制
OpenLayers?是一個專為Web?GIS?客戶端開發(fā)提供的JavaScript?類庫包,用于實(shí)現(xiàn)標(biāo)準(zhǔn)格式發(fā)布的地圖數(shù)據(jù)訪問。本文將利用OpenLayer實(shí)現(xiàn)自定義坐標(biāo)點(diǎn)的繪制,感興趣的可以了解一下2022-04-04
Javascript摸擬自由落體與上拋運(yùn)動原理與實(shí)現(xiàn)方法詳解
這篇文章主要介紹了Javascript摸擬自由落體與上拋運(yùn)動,結(jié)合實(shí)例形式分析了Javascript摸擬自由落體與上拋運(yùn)動相關(guān)原理、實(shí)現(xiàn)技巧與操作注意事項(xiàng),需要的朋友可以參考下2020-04-04
JS實(shí)現(xiàn)淡藍(lán)色簡潔豎向Tab點(diǎn)擊切換效果
這篇文章主要介紹了JS實(shí)現(xiàn)淡藍(lán)色簡潔豎向Tab點(diǎn)擊切換效果,通過JavaScript相應(yīng)鼠標(biāo)事件實(shí)現(xiàn)非常簡單的css樣式切換,簡單實(shí)用,需要的朋友可以參考下2015-10-10
微信小程序?qū)崿F(xiàn)全局狀態(tài)管理的方法整理
已知微信小程序中如果要做到全局狀態(tài)共享,常用的有四種方式,分別是globalData、本地緩存、mobx-miniprogram和westore,本文將帶大家看看mobx-miniprogram是如何實(shí)現(xiàn)的小程序的全局狀態(tài)管理,需要的可以收藏一下2023-06-06
js中confirm實(shí)現(xiàn)執(zhí)行操作前彈出確認(rèn)框的方法
這篇文章主要介紹了js中confirm實(shí)現(xiàn)執(zhí)行操作前彈出確認(rèn)框的方法,是執(zhí)行刪除等操作時常用的功能,非常具有實(shí)用價值,需要的朋友可以參考下2014-11-11
淺談JavaScript暫時性死區(qū)與垃圾回收機(jī)制
本文主要介紹了淺談JavaScript暫時性死區(qū)與垃圾回收機(jī)制,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
Three.js實(shí)現(xiàn)3D乒乓球小游戲(物理效果)
本文將使用React Three Fiber 和 Cannon.js 來實(shí)現(xiàn)一個具有物理特性的乒乓球小游戲,使用 React Three Fiber 搭建基礎(chǔ)三維場景、如何使用新技術(shù)棧給場景中對象的添加物理特性等,最后利用上述知識點(diǎn),將開發(fā)一個簡單的乒乓球小游戲,需要的朋友可以參考下2023-03-03

