現在是下午2點50分,眼睛和肩膀都有點酸,腦子有點木。
1,**布局按鍵和區域:
乙個6行的**。第一和第二行分別是兩個type=「text」的,寬度佔據了四列的寬度,colspan="4",分別是輸入和輸出的顯示行。第三行有兩列,分別是清零和退位按鍵。給每個按鍵標記id和value.
2,指令碼寫的時候思路真的很重要,**的邏輯塊很凌亂,結構和可讀性差,進入狀態就得一會功夫啊。
2.1按照按鍵分類:
如果按下小數點,但輸入中已經包含了乙個小數點時,此時按鍵無效;
如果按下0,且之前無輸入值時,此時按鍵無效,如果還有按鍵0一直按下,則按鍵仍無效;
如果輸入值的長度過大,則按鍵無效;
如果按下小數點,但此前無輸入值或輸入值為0時,則儲存當前輸入值為"0.";
如果按下0,且輸入值長度大於1時,則認為當前輸入有效,依次儲存到輸入值中;
如果按下的1-9或.,則依次儲存到輸入中;
如果按下運算符號+-*/,將輸入值轉化成浮點型儲存到number1中,並清空輸入值,將當前的運算符號儲存在mysi中;
如果按下=,將輸入值轉化成浮點型儲存到number2中,並清空輸入值,按照已儲存的mysi的運算符號、number1,進行計算;
2.2輸入值、輸出值的實時顯示。
2.3
最後考慮清零鍵,退位鍵和輸入輸出建立關係,並完善。
3,多次測試,查bug。
結果:功能基本完成。
體會:2/3的時間是最後輸入值和輸出值的實時顯示,真的有點不可思議。有可能是前面的部分功能已實現,沾沾自喜、盲目大意。乙個特別清醒的狀態做最後的完善真的很重要,這兩天雜事多,狀態不好。
最初的邏輯框架清晰簡潔很重要,就像建築物的根基。根基太淺,負重過大,**很累贅。孔隙太小,塞磚頭的地方太少,房子空間太小,太侷限了。
最後的完善部分往往能畫龍點睛、錦上添花,但是這點我真的做的不好。
善始善終,勉勵自己。
2023年5月23下午:
收到一系列的修改意見
1,輸入框:校驗無效的輸入字元(漢字,字母等),限制輸入位數。
2,沒有a=?的運算
3,連續計算1+2+5=?
動態監聽輸入框輸入的值。
利用onkeydown去指示使用者按下按鍵後執行的**。
在這個事件屬性下,定義乙個函式。event.keycode可以讀取當前鍵盤按下的keycode值。(keycode不同於ascii)
keycode的乙個按鍵(可能含多個符號)對應乙個鍵碼值,那麼問題來了:
問題1:鍵盤上「+」和「=」同時占用了乙個按鍵,讀取鍵碼值後若經過keystring=string.fromcharcode(keycode)轉化為按鍵的鍵碼符號是取其中的哪乙個?
問題2:鍵盤上又存在多個鍵「1」(大鍵盤)和「1」(小鍵盤),規定使用者兩個鍵都可輸入1還是怎麼辦呢?
如果只用大鍵盤,其中「8」和「*」復用同乙個鍵碼。不好辦!
如果大鍵盤啟用數字1-9,運算符號+-*/啟用小鍵盤,感覺也不是很合理。
如果大鍵盤中和小鍵盤的數字都可用,運算符號只能用啟用小鍵盤。
如果只用小鍵盤,應該也算合理。
2023年5月23晚:
動態監聽輸入框輸入值,我糾結了乙個下午+吃飯的時間。
其實仔細想想onkeydown屬性明明就已經說的很明白了,乙個鍵按下去檢測這個鍵。不可能用shift去復用,因為shift也是乙個鍵。
甚至還想到shift+8後期處理正規表示式的時候再去從新定義,但這給使用者使用時帶來很多疑惑和不便。
只能說,我醉心於自己的腦洞了。
然則,動態監測鍵盤輸入oninput屬性和onpropertychange屬性。分別是非ie和ie下對當前值改變做出響應的指令碼。
經過event.target.value或event.srcelement.value即可讀取當前輸入框的value。
啊哈,經過敲**驗證發現這個方法真的很靠譜,克服了onkeydown中只讀取乙個單獨鍵碼的缺點。
既然已經可以讀取當前的輸入表示式,接下來的問題就是用正規表示式去分析數學表示式的問題了。
2023年5月24中午:
用正規表示式匹配輸入的計算式。
1,輸入的字串中如果有包含0-9,小數點,+-*/,=和()以外的符號,就認為這個計算式是非法的。非法的計算式應該在使用者輸入的時候就給予提醒和限制,這和使用者在填寫表單時客戶端指令碼驗證的情況應該是一樣的,所以,這裡還需要完善一下。
2,輸入的字串中先考慮篩選括號。從左到右匹配過程中,如果匹配到左括號按照先後順序則標註下來「l1」「l2」---「ln」,直到遇到右括號,標註為"rn",再繼續匹配到「r1」。如果再遇到左括號「l(n+1)」以此類推。如果匹配完後,左右個數不等,也認為輸入的表示式無效。匹配好的括號,從記憶體依次向外計算,直到退去括號。
3,退去括號的表示式匹配*/,並計算,直到所有*/都計算完。
4,表示式中只包含+-,依次計算得到最終結果。
這是我遇到問題時,最早的想法。可是,我又一次發現自己把問題想的太複雜了。
只要將字串經過匹配轉化成計算式,計算機本身可以計算含括號的計算式。為什麼老是把問題複雜化啊,讓我這種智商低的人悄悄地哭一會吧。
接下來我要做的就是把字串匹配轉化成有效的計算表示式。好吧,現在去吃飯拿快遞回去睡覺吧。
2023年5月26日晚:
現在的心情略有一點點興奮,剛剛自己測試完1.91版本,沒有發現bug.
站在不同的高度俯瞰全域性確實是不同的思路。
第乙個版本的計算器:介面上的按鍵輸入,不允許連續運算。
第二個版本的計算器:除了介面上的按鍵輸入,還可識別使用者用鍵盤在輸入框輸入的字元,不允許連續運算。
第三個版本的計算器:介面上按鍵輸入和使用者鍵盤輸入可交叉進行,並且允許連續計算。
實現乙個jQuery的API
一.首先 var div div div.addclass red 可將所有 div 的 class 新增乙個 red div.settext hi 可將所有 div 的 textcontent 變為 hijquery本質上就是乙個建構函式,我們需要給它輸入引數,就可以返回對應引數的jquery例項...
實現乙個jquery的api
新增多個classname的函式 nodes.addclass function classes 定義乙個偽陣列,用來存要操作的節點 if nodeorselector string 如果傳的是字串,則用選擇器去查詢 如果傳入的值是節點,返回的nodes也寫成偽陣列的形式 nodes.addclas...
JQuery實現乙個簡單的滑鼠跟隨提示效果
效果體驗 實現思路 1 滑鼠移入標題 這裡是標籤 建立乙個div,div的內容為滑鼠位置的文字 將建立好的div加到文件中 為提示層設定位置 2 滑鼠移出標題 移除div 3 當滑鼠在標題內移動時 同樣新增div效果 上面是跟隨游標的,這個是居中的 1.htm 跟隨游標完整 如下 1 doctype...