前端開發(fā)之便利店收銀系統(tǒng)代碼
更新時間：2019年12月27日 10:34:31 作者：龍須餅是怎么做的
這篇文章主要介紹了社區(qū)便利店收銀系統(tǒng)代碼,使用前端初級開發(fā)者，代碼很簡單需要的朋友可以參考下
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)代碼，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
如果你覺得本文對你有幫助，歡迎轉(zhuǎn)載，煩請注明出處，謝謝！
相關(guān)文章
這篇文章主要介紹了JavaScript?原始包裝類型匯總，文章圍繞主題展開詳細的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-05-05
javascript得到XML某節(jié)點的子節(jié)點個數(shù)的腳本
得到XML某節(jié)點（pnode）的子節(jié)點個數(shù)（客戶端）2008-10-10
javascript實現(xiàn)Table間隔色以及選擇高亮(和動態(tài)切換數(shù)據(jù))的方法
這篇文章主要介紹了javascript實現(xiàn)Table間隔色以及選擇高亮(和動態(tài)切換數(shù)據(jù))的方法,涉及javascript表格操作及按鈕實現(xiàn)表格切換的技巧,需要的朋友可以參考下2015-05-05
這篇文章主要介紹了關(guān)于微信公眾號開發(fā)無法支付的問題解決，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-12-12
JavaScript組合設(shè)計模式--改進引入案例分析
這篇文章主要介紹了JavaScript組合設(shè)模式改進引入案例,結(jié)合實例形式分析了JavaScript組合設(shè)計模式特性改進的引入示例相關(guān)操作技巧,需要的朋友可以參考下2020-05-05
JavaScript實現(xiàn)簡易購物車最全代碼解析(ES6面向?qū)ο?
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)簡易購物車最全代碼，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
在小程序中集成redux/immutable/thunk第三方庫的方法
這篇文章主要介紹了在小程序中集成redux/immutable/thunk第三方庫的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-08-08
這篇文章主要介紹了js實現(xiàn)編輯div節(jié)點名稱的方法,可實現(xiàn)針對div節(jié)點名稱的編輯及樣式的選擇效果,并且分別針對IE與FF瀏覽器的樣式進行了選擇與控制,具有一定的參考借鑒價值,需要的朋友可以參考下2014-12-12
Object.keys() 和 Object.getOwnPropertyNames() 的區(qū)別詳解
這篇文章主要介紹了Object.keys() 和 Object.getOwnPropertyNames() 的區(qū)別詳解，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-05-05
srcElement表格樣式...2006-09-09