商城商品購買數量增減的完美JS效果

2022-02-13 09:22:39 字數 1079 閱讀 2850

效果如下:

以下是html**

-

+加入借閱臺

首先看第一條:

輸入一定是數字

這很容易想到用keyup事件監測,用正規表示式替換非數字字元

$("#booknum").keyup(function());
這樣就可以保證使用者輸入的一定是數字了,並且我們中間做了校驗,如果使用parseint轉換為整數後值是nan,就讓值為1 ,但是我們會發現乙個現象,就是使用者如果想清空裡面的值輸入20的時候,發現裡面的值總是會變成1

這是不合理的,並且體驗也不好,在輸入非數字的時候,會先顯示那個字元,然後被替換掉。

再觀察一下當當網,京東這些**,當輸入非數字時,輸入框根本就不會有任何動靜,退格後 還能隨意輸入數字。經研究發現,他們使用了監控鍵盤的方法,攔截輸入。

經過改進後:

$("#booknum").keypress(function(b)  else 

})

這樣我們保證了在使用者使用取消回車(0),退格(8),左右箭頭(37 39)和數字時 正常輸入,其他按鍵就統統失效了。這樣就能保證輸入的內容是數字了。

但是還有乙個問題,使用者使用退格鍵將內容清空後,使用者沒有輸入的時候,值為空

這就要使用keyup和blur事件來彌補了

$("#booknum").keypress(function(b)  else 

}).keyup(function(e)

}).blur(function() );

這樣就能保證使用者在輸入數字的時候的校驗。

使用按鈕控制就更容易了:

//增加

$("#add").click(function() );

//減去

$("#sub").click(function() );

好了,這樣就完美解決使用者輸入了。

當然,這裡僅僅說明了js的控制,裡面還可以加入其它控制,比如最大限制,庫存查詢,伺服器校驗等。

C 小商城購買系統。類似商品購買類系統

迴圈輸入商品編號和購買數量,系統自動計算每種商品的價錢 單價x數量 並累加總金額。當輸入n時結賬 假設享受8折優惠 結賬時,根據折扣計算應付金額,輸入實付金額,並找零 12 3using system for int k 1 k 0 k 數量 合計 shirt,b,totalprices if a ...

分析玩家購買虛擬商品的真正原因

我曾不止一次聽說了人們對虛擬商品和花錢買樂趣的一些誤解,喜歡玩免費遊戲的使用者就會買虛擬商品,因為他們已經習慣於花錢獲得娛樂體驗,而虛擬商品正是我們提供的樂趣所在。但事實並非如此。使用者並不會因為自己喜歡玩遊戲,然後就為其中的虛擬商品付費。假如你執拗於前面那種想法,那就很難利用病毒傳播功能和強迫迴圈...

分析玩家購買虛擬商品的真正原因

我曾不止一次聽說了人們對虛擬商品和花錢買樂趣的一些誤解,喜歡玩免費遊戲的使用者就會買虛擬商品,因為他們已經習慣於花錢獲得娛樂體驗,而虛擬商品正是我們提供的樂趣所在。但事實並非如此。使用者並不會因為自己喜歡玩遊戲,然後就為其中的虛擬商品付費。假如你執拗於前面那種想法,那就很難利用病毒傳播功能和強迫迴圈...