JS實(shí)現(xiàn)一個(gè)簡(jiǎn)易的計(jì)算器步驟詳解

有了這個(gè)函數(shù)得到最終結(jié)果就很容易了。我的思路是在用戶輸入要計(jì)算的式子時(shí)不加干預(yù)，最終的計(jì)算從input輸入框中獲取value值，然后把這個(gè)value值作為參數(shù)傳遞給eval，并使用try catch(exception)來捕獲并處理異常。

3.通過事件代理綁定事件

因?yàn)槊總€(gè)button都需要有一個(gè)點(diǎn)擊事件，如果一個(gè)一個(gè)去綁定，會(huì)導(dǎo)致代碼十分的不簡(jiǎn)潔，而且效率也非常低。這時(shí)就可以考慮使用事件代理，由于事件冒泡的原理，我們可以把點(diǎn)擊事件綁定在table上，然后通過判斷事件發(fā)生的具體對(duì)象來做出不同的反應(yīng)，調(diào)用不同的函數(shù)。

4.其他效果

可以根據(jù)自己的設(shè)計(jì)思路，添加其他的效果。我主要是添加了一個(gè)錯(cuò)誤提示的動(dòng)畫：如果eval函數(shù)拋出異常，則從上面緩慢滑下一個(gè)圖片，并且通過setTimeout來設(shè)置了停留的時(shí)間。

5.注意細(xì)節(jié)

在設(shè)置enter鍵按下獲得結(jié)果的時(shí)候，keydown事件對(duì)象應(yīng)該為整個(gè)table，并且應(yīng)該阻止enter鍵的默認(rèn)行為
獲取元素樣式時(shí)需要寫一個(gè)兼容函數(shù)，因?yàn)閛bj.style.attr只能獲取行間樣式，要像獲取外部樣式需要用getComputedStyle(obj,false)[attr]或兼容IE的obj.currentStyle[attr]。

相信看了本文案例你已經(jīng)掌握了方法，更多精彩請(qǐng)關(guān)注Gxl網(wǎng)其它相關(guān)文章！

推薦閱讀：

不同版本React路由跳轉(zhuǎn)方法匯總

Angular路由守衛(wèi)使用步驟詳解

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com