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