關(guān)于微信公眾號(hào)開發(fā)無法支付的問題解決
前提:由于涉及公司業(yè)務(wù),部分核心代碼無法展示,這里僅僅是聊一下如何解決微信公眾號(hào)支付無法支付的解決方案。
問題:微信公眾號(hào)平臺(tái)支付失敗。
頁(yè)面:大致頁(yè)面就是下面這張圖片(引自《公眾號(hào)支付開發(fā)者文檔》中的"公眾號(hào)支付"-"場(chǎng)景介紹")所展示的那樣,可以選擇充值金額,可以點(diǎn)擊立即充值,然后就可以進(jìn)行充值了。
現(xiàn)象:
1、點(diǎn)擊"立即充值"按鈕,頁(yè)面將會(huì)顯示微信支付慣有的灰色加載(我也只能形容成這樣了),然后一閃而過,無法進(jìn)行正常的充值業(yè)務(wù);
2、此充值頁(yè)面無法正常加載。表現(xiàn)為微信上方綠色進(jìn)度條瞬間加載完成,但無法顯示正常的頁(yè)面,是一片白色的屏幕;
3、點(diǎn)擊"立即充值"按鈕,頁(yè)面無跳轉(zhuǎn),頁(yè)面無反應(yīng),頁(yè)面死活不動(dòng),死了。
排查步驟編號(hào):
從這里開始是我對(duì)于整個(gè)問題的排查流程,其中因?yàn)樯婕?個(gè)問題,為了條理更加清晰,這里的三大問題就用阿拉伯?dāng)?shù)字(1、2、3)表示,內(nèi)在流程歸屬于1.1、1.2、1.3......3.1這樣的形式(這里希望可以得到更好的分類建議,我這邊兒現(xiàn)在沒有太多的時(shí)間去查閱文章編號(hào)規(guī)則,寫論文的那點(diǎn)兒套路早就忘了)。
排查&解決:
1. 針對(duì)"點(diǎn)擊'立即充值'按鈕,頁(yè)面將會(huì)顯示微信支付慣有的灰色加載(我也只能形容成這樣了),然后一閃而過,無法進(jìn)行正常的充值業(yè)務(wù)"的問題解決。
1.1 起先排查后臺(tái)日志,進(jìn)入微信后臺(tái)模塊所部署的生產(chǎn)環(huán)境內(nèi)??截惍?dāng)前日志,通過vim命令查看該日志,依照客服提供的充值時(shí)間點(diǎn)進(jìn)行排查,最終查到這樣一個(gè)錯(cuò)誤:
<xml> <return_code><![CDATA[FAIL]]></return_code> <return_msg><![CDATA[invalid out_trade_no]]></return_msg> </xml>
從字面意思可以看出這是在告訴我出現(xiàn)了非法的訂單號(hào),這樣我又一次依據(jù)此日志記錄向上排查其他日志信息,又發(fā)現(xiàn)了一個(gè)疑問(除卻紅色標(biāo)注的out_trade_no,其余內(nèi)容數(shù)據(jù)已替換成《公眾號(hào)支付開發(fā)者文檔》中的"API列表"-"統(tǒng)一下單"-"請(qǐng)求參數(shù)"提供的示例值):
appid=wxd678efh567hg6787& body=會(huì)員充值& device_info=013467007045764& mch_id=1230000109& nonce_str=5K8264ILTKCH16CQ2502SI8ZNMTM67VS& notify_url=http://www.weixin.qq.com/wxpay/pay.php& openid=oUpF8uMuAJO_M2pxb1Q9zNjWeS6o& out_trade_no=2018年04月08日17時(shí)1609001& total_fee=1000& trade_type=JSAPI& key=KevenPotter
這個(gè)疑問就是發(fā)現(xiàn)我的訂單編號(hào)出現(xiàn)了中文字符,然而,在《公眾號(hào)支付開發(fā)者文檔》中的"API列表"-"統(tǒng)一下單"中明文規(guī)定,out_trade_no(商戶訂單號(hào))要求32個(gè)字符內(nèi),只能是數(shù)字、大小寫字母_-|* 且在同一個(gè)商戶號(hào)下唯一。
那么也就是說我的"訂單號(hào)(out_trade_no)"確實(shí)出問題了;
1.2 定位問題后,開始查看這個(gè)訂單號(hào)是如何生成的,怎么會(huì)出現(xiàn)中文字符這種類型呢。因?yàn)橛腥罩拘畔?,那么就去后臺(tái)代碼中去依照日志信息找到這行出錯(cuò)的代碼,最后經(jīng)過排查,定位到service層業(yè)務(wù)處理類。在此中業(yè)務(wù)處理類中,wxUnifiedOrder()方法內(nèi),這個(gè)out_trade_no就已經(jīng)傳了進(jìn)來。
這時(shí)候就考慮業(yè)務(wù),充值這個(gè)行為是用戶行為,具體為用戶點(diǎn)擊事件,那么用戶為什么點(diǎn)擊,是因?yàn)橛羞@個(gè)按鈕,那么這個(gè)按鈕是在哪里呢,理所當(dāng)然的首先想到頁(yè)面。因?yàn)槲覀冞@個(gè)技術(shù)用到的是ionic3和cordova,所以也就立馬去找頁(yè)面觸發(fā)的這個(gè)方法內(nèi)是什么樣的業(yè)務(wù)處理邏輯。直到我看到ts文件中out_trade_no是這樣定義的:
let out_trade_no = this.datePipe.transform(new Date(), 'yyyyMMddHHmmss') + xxx;
從這里可以看到,當(dāng)初寫這個(gè)方法的人確實(shí)在規(guī)避問題,進(jìn)行了格式化,但是為什么這塊格式化的代碼并沒有起作用而是被污染了,現(xiàn)在我也無法理解(有的同事說new Date()方法創(chuàng)建的是手機(jī)本地系統(tǒng)時(shí)間,有的手機(jī)系統(tǒng)時(shí)間就是中文格式,所以這里的訂單號(hào)也就出現(xiàn)了中文)。而且到底是前端污染還是后端格式化污染無從排查(因?yàn)檎伊舜罅抗就逻M(jìn)行測(cè)試,都沒有發(fā)現(xiàn)錯(cuò)誤訂單的發(fā)生,問題重現(xiàn)很難[能遇上這種問題的客戶,可以去買買彩票了~])。
現(xiàn)在先貼一下構(gòu)建后端xml格式的代碼,希望一些大神可以解釋一下String.format中的一些坑~
private String buildPayXml(String appid, String body, String mch_id, String nonce_str, String notify_url, String openid, String out_trade_no, String sign, String total_fee) { String xmlStr = String.format( "<xml>" + "<appid><![CDATA[%s]]></appid>" + "<body><![CDATA[%s]]></body>" + "<device_info><![CDATA[XXX]]></device_info>" + "<mch_id><![CDATA[%s]]></mch_id>" + "<nonce_str><![CDATA[%s]]></nonce_str>" + "<notify_url><![CDATA[%s]]></notify_url>" + "<openid><![CDATA[%s]]></openid>" + "<out_trade_no><![CDATA[%s]]></out_trade_no>" + "<sign><![CDATA[%s]]></sign>" + "<total_fee><![CDATA[%s]]></total_fee>" + "<trade_type><![CDATA[JSAPI]]></trade_type>" + "</xml>", appid, body, mch_id, nonce_str, notify_url, openid, out_trade_no, sign, total_fee); return xmlStr; }
所以這里的問題就是這個(gè)非法訂單的值是從前端傳過來的還是在后端格式化錯(cuò)誤的,由此引發(fā)出兩種解決方案。
1.3 解決方案:
(1)、從前端頁(yè)面進(jìn)行控制,不再使用之前的的格式化時(shí)間方式,而是重新創(chuàng)建一個(gè)方法叫做createTradeNo():
/** * @Company {http://www.XXX.cn/} * @author {KevenPotter} * @description * {Do not delete this method. This method is to increase for the number of users * can not recharge by WeChat, because the formatting method before this method may result * in illegal date format, which will lead to illegal order number of the user * order Characters. This method is similar to a hard-coded effect and aims to * forcibly obtain a numeric "year, month, and day" when creating a new Date class, * rather than a wrong conversion by the previous formatting method.} * @description * {此方法請(qǐng)勿刪除.此方法的存在是為了處理部分用戶無法充值而增加的,因?yàn)榇朔椒ㄖ暗母袷交? * 方法可能會(huì)出現(xiàn)日期格式化非法的結(jié)果,這樣將會(huì)導(dǎo)致用戶訂單的訂單號(hào)出現(xiàn)非法字符.此方法屬于 * 類似硬編碼的效果,旨在當(dāng)新建Date類時(shí),強(qiáng)行獲取數(shù)字型的"年月日",而不是由之前的格式化方法 * 進(jìn)行錯(cuò)誤的轉(zhuǎn)換} * @param {No Parameter} * @returns {String} */ private createTradeNo(): string { let dateNow = new Date(); let year: number = dateNow.getFullYear(); let month: string | number = (dateNow.getMonth() + 1) < 10 ? "0" + (dateNow.getMonth() + 1) : (dateNow.getMonth() + 1); let day: string | number = dateNow.getDate() < 10 ? "0" + dateNow.getDate() : dateNow.getDate(); let hours: string | number = dateNow.getHours() < 10 ? "0" + dateNow.getHours() : dateNow.getHours(); let minutes: string | number = dateNow.getMinutes() < 10 ? "0" + dateNow.getMinutes() : dateNow.getMinutes().toString(); let seconds: string | number = dateNow.getSeconds() < 10 ? "0" + dateNow.getSeconds() : dateNow.getSeconds(); let out_trade_no: string = "" + year + month + day + hours + minutes + seconds + userId; return out_trade_no; }
這種方式類似于硬編碼的方式,就是強(qiáng)行獲取數(shù)字型年月日時(shí)分秒等值,然后轉(zhuǎn)換為字符串進(jìn)行傳參;
(2)、從后端業(yè)務(wù)進(jìn)行攔截,攔截的地方就是傳參的開始,我這里采用網(wǎng)上比較通用的正則表達(dá)式的方式,只要是數(shù)字的就要,其他的剔除:
String regEx = "[^0-9]"; Pattern pattern = Pattern.compile(regEx); Matcher matcher = pattern.matcher(out_trade_no); String outTradeNo = matcher.replaceAll("").trim(); // 過濾后的訂單
1.4 這兩種方案出現(xiàn)之后,經(jīng)過和同事商議,決定采用第二種解決方法,但不刪除第一種解決策略,如果第二種方法不可以,再采用第一種解決策略。經(jīng)過部署于客戶反饋,微信充值問題大部分已解決(75%)。
2. 針對(duì)"頁(yè)面無法正常加載,微信上方綠色進(jìn)度條瞬間加載完成,無法顯示正常的頁(yè)面,是一片白色的屏幕"的問題解決。
2.1 首先依據(jù)客服的反饋,我們?cè)诠镜膬?nèi)部進(jìn)行了一次測(cè)試,目的是問題的重現(xiàn)??偣矞y(cè)試了20個(gè)手機(jī),遺憾的是全部通過,指導(dǎo)硬件部門有一個(gè)人也想來做一下測(cè)試,這時(shí)發(fā)生了頁(yè)面白屏現(xiàn)象。我們后來進(jìn)過對(duì)比,才發(fā)現(xiàn)這種情況的出現(xiàn)好似和微信昵稱有關(guān)聯(lián)。即,這個(gè)人的昵稱帶有特殊符號(hào)。
這時(shí),我們項(xiàng)目經(jīng)理指出,這應(yīng)該是數(shù)據(jù)庫(kù)編碼出現(xiàn)了問題,特殊符號(hào)(emoji)無法存入。但是還需進(jìn)行測(cè)驗(yàn),要在內(nèi)部把問題重現(xiàn)出來。
2.2 搭建本地測(cè)試環(huán)境,進(jìn)行測(cè)試(就是改變自己的微信昵稱同時(shí)加入emoji表情符號(hào))。但是進(jìn)行了大致四次的更換,還是無法重現(xiàn)問題。之后經(jīng)過同事提醒發(fā)來了蘋果手機(jī)的表情,再次進(jìn)行測(cè)試,問題重現(xiàn)~
重現(xiàn)問題之后,查看日志記錄,現(xiàn)粘貼如下:
2018-04-23 22:59:06.432 INFO 120 --- [p-nio-80-exec-1] com.hh.rest.app.service.WechatService :
xml msg:
<xml>
<ToUserName><![CDATA[toUser]]></ToUserName>
<FromUserName><![CDATA[oUpF8uMuAJO_M2pxb1Q9zNjWeS6o]]></FromUserName>
<CreateTime>1524495419</CreateTime>
<MsgType><![CDATA[event]]></MsgType>
<Event><![CDATA[subscribe]]></Event>
<EventKey><![CDATA[]]></EventKey>
</xml>
2018-04-23 22:59:06.521 INFO 120 --- [p-nio-80-exec-1] com.hh.rest.app.service.WechatService : enter subscribe
{"country":"中國(guó)","qr_scene":0,"subscribe":1,"city":"朝陽(yáng)","openid":"oUpF8uMuAJO_M2pxb1Q9zNjWeS6o","tagid_list":[],"sex":1,"groupid":0,
"language":"zh_CN","remark":"","subscribe_time":1524495419,"province":"北京","subscribe_scene":"ADD_SCENE_QR_CODE","nickname":"口哈哈哈",
"headimgurl":"http://thirdwx.qlogo.cn/mmopen/iaXTwdhNbibo6cBH1GClwSgkEictOnsAN8v6JY6eB1O7ibddGXXn1iceAnZlrd8OiaqdWNAL1wGqPAc3ibDNBCQFqulvXwhEzHSnwJ8/132",
"qr_scene_str":""}
2018-04-23 22:59:06.917 INFO 120 --- [p-nio-80-exec-1] com.hh.rest.app.service.WechatService : userInfoObj:
{"country":"中國(guó)","qr_scene":0,"subscribe":1,"city":"朝陽(yáng)","openid":"oUpF8uMuAJO_M2pxb1Q9zNjWeS6o","tagid_list":[],"sex":1,"groupid":0,
"language":"zh_CN","remark":"","subscribe_time":1524495419,"province":"北京","subscribe_scene":"ADD_SCENE_QR_CODE","nickname":"口哈哈哈",
"headimgurl":"http://thirdwx.qlogo.cn/mmopen/iaXTwdhNbibo6cBH1GClwSgkEictOnsAN8v6JY6eB1O7ibddGXXn1iceAnZlrd8OiaqdWNAL1wGqPAc3ibDNBCQFqulvXwhEzHSnwJ8/132",
"qr_scene_str":""}
Hibernate: select userentity0_.id as id1_13_, userentity0_.balance as balance2_13_, userentity0_.coupon as coupon3_13_, userentity0_.credit as credit4_13_, userentity0_.is_admin as is_admin5_13_, userentity0_.is_agent as is_agent6_13_, userentity0_.is_partner as is_partn7_13_, userentity0_.wx_icon as wx_icon8_13_, userentity0_.wx_name as wx_name9_13_, userentity0_.wx_open_id as wx_open10_13_, userentity0_.wx_subscribe_ts as wx_subs11_13_, userentity0_.wx_subscribed as wx_subs12_13_ from user userentity0_ where userentity0_.wx_open_id=?
Hibernate: insert into user (balance, coupon, credit, is_admin, is_agent, is_partner, wx_icon, wx_name, wx_open_id, wx_subscribe_ts, wx_subscribed) values (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
2018-04-23 22:59:06.970 WARN 120 --- [p-nio-80-exec-1] o.h.engine.jdbc.spi.SqlExceptionHelper : SQL Error: 1366, SQLState: HY000
2018-04-23 22:59:06.970 ERROR 120 --- [p-nio-80-exec-1] o.h.engine.jdbc.spi.SqlExceptionHelper : Incorrect string value: '\xF0\x9F\x8D\xB4\xE5\x93...' for column 'wx_name' at row 1
2018-04-23 22:59:06.993 ERROR 120 --- [p-nio-80-exec-1] c.h.r.a.e.GlobalExceptionHandler : /rest/wechat/checkSign?signature=f3cac2272ab3f442b32d8560f024919240ab96e1×tamp=1524495419&nonce=451675791&openid=oUpF8uMuAJO_M2pxb1Q9zNjWeS6o; Error: could not execute statement; nested exception is org.hibernate.exception.GenericJDBCException: could not execute statement
2018-04-23 22:59:07.008 WARN 120 --- [p-nio-80-exec-1] .m.m.a.ExceptionHandlerExceptionResolver : Resolved exception caused by Handler execution: org.springframework.orm.jpa.JpaSystemException: could not execute statement; nested exception is org.hibernate.exception.GenericJDBCException: could not execute statement
我們從日志顯示上來看,其實(shí)就可以看出來,所有的用戶信息都已正常獲取,但是之后卻有兩個(gè)ERROR(紅字標(biāo)注部分)報(bào)錯(cuò)。其中第一條ERROR告訴我們SQL語(yǔ)句錯(cuò)誤,那么第二條ERROR提示的更加明顯(向wx_name字段插入了不正確的字符串值)。那么,從網(wǎng)上借鑒的解決方法來看,確實(shí)是數(shù)據(jù)庫(kù)編碼問題,無法存入emoji特殊表情。
2.3 解決方案:
依據(jù)網(wǎng)上的解決方法,我們?cè)跍y(cè)試環(huán)境下(我們使用的數(shù)據(jù)庫(kù)的版本為MySQL5.6.39)修改my.cnf(Linux下為my.cnf,Windows下為my.ini)數(shù)據(jù)庫(kù)的配置文件,在下面添加(無則添加,有則修改):
[client] default-character-set = utf8mb4 [mysql] default-character-set = utf8mb4 [mysqld] character-set-server = utf8mb4 collation-server = utf8mb4_unicode_ci
修改完數(shù)據(jù)庫(kù)全局配置之后,再修改我們測(cè)試庫(kù)的編碼為utf8mb4,同時(shí)再修改emoji特殊符號(hào)所存入字段wx_name的編碼為utf8mb4,此時(shí),進(jìn)行本地測(cè)試,問題不再出現(xiàn),之后,在生產(chǎn)環(huán)境同樣應(yīng)用上述配置,問題解決。從這里我們其實(shí)可以看出更多的問題,就是現(xiàn)如今,已然出現(xiàn)了更好的編碼方式,而公司內(nèi)部,依舊使用的是舊有的編碼模式,而不考量日后的擴(kuò)展。說的與時(shí)俱進(jìn),其實(shí)也是一種換湯不換藥的死硬做法,這是我們需要警惕的?,F(xiàn)貼出成功后的日志記錄:
2018-04-23 23:07:54.218 INFO 120 --- [p-nio-80-exec-9] com.hh.rest.app.service.WechatService :
xml msg:
<xml>
<ToUserName><![CDATA[toUser]]></ToUserName>
<FromUserName><![CDATA[oUpF8uMuAJO_M2pxb1Q9zNjWeS6o]]></FromUserName>
<CreateTime>1524495947</CreateTime>
<MsgType><![CDATA[event]]></MsgType>
<Event><![CDATA[subscribe]]></Event>
<EventKey><![CDATA[]]></EventKey>
</xml>
2018-04-23 23:07:54.226 INFO 120 --- [p-nio-80-exec-9] com.hh.rest.app.service.WechatService : enter subscribe
{"country":"中國(guó)","qr_scene":0,"subscribe":1,"city":"朝陽(yáng)","openid":"oUpF8uMuAJO_M2pxb1Q9zNjWeS6o","tagid_list":[],"sex":1,"groupid":0,"language":"zh_CN","remark":"","subscribe_time":1524495947,"province":"北京","subscribe_scene":"ADD_SCENE_QR_CODE","nickname":"口哈哈哈","headimgurl":"http://thirdwx.qlogo.cn/mmopen/iaXTwdhNbibo6cBH1GClwSgkEictOnsAN8v6JY6eB1O7ibddGXXn1iceAnZlrd8OiaqdWNAL1wGqPAc3ibDNBCQFqulvXwhEzHSnwJ8/132","qr_scene_str":""}
2018-04-23 23:07:54.542 INFO 120 --- [p-nio-80-exec-9] com.hh.rest.app.service.WechatService : userInfoObj: {"country":"中國(guó)","qr_scene":0,"subscribe":1,"city":"朝陽(yáng)","openid":"oUpF8uMuAJO_M2pxb1Q9zNjWeS6o","tagid_list":[],"sex":1,"groupid":0,"language":"zh_CN","remark":"","subscribe_time":1524495947,"province":"北京","subscribe_scene":"ADD_SCENE_QR_CODE","nickname":"口哈哈哈","headimgurl":"http://thirdwx.qlogo.cn/mmopen/iaXTwdhNbibo6cBH1GClwSgkEictOnsAN8v6JY6eB1O7ibddGXXn1iceAnZlrd8OiaqdWNAL1wGqPAc3ibDNBCQFqulvXwhEzHSnwJ8/132","qr_scene_str":""}
Hibernate: select userentity0_.id as id1_13_, userentity0_.balance as balance2_13_, userentity0_.coupon as coupon3_13_, userentity0_.credit as credit4_13_, userentity0_.is_admin as is_admin5_13_, userentity0_.is_agent as is_agent6_13_, userentity0_.is_partner as is_partn7_13_, userentity0_.wx_icon as wx_icon8_13_, userentity0_.wx_name as wx_name9_13_, userentity0_.wx_open_id as wx_open10_13_, userentity0_.wx_subscribe_ts as wx_subs11_13_, userentity0_.wx_subscribed as wx_subs12_13_ from user userentity0_ where userentity0_.wx_open_id=?
Hibernate: insert into user (balance, coupon, credit, is_admin, is_agent, is_partner, wx_icon, wx_name, wx_open_id, wx_subscribe_ts, wx_subscribed) values (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
此時(shí),微信充值問題絕大大部分解決(95%)。
3. 針對(duì)"點(diǎn)擊立即充值,頁(yè)面無跳轉(zhuǎn),頁(yè)面無反應(yīng),頁(yè)面死活不動(dòng),死了"的問題......
關(guān)于這個(gè)問題,我們沒有解決,不過現(xiàn)在問題定位很是明晰,這個(gè)問題的出現(xiàn),99%的用戶使用的是蘋果手機(jī),其版本為9抑或是9以下。關(guān)于這個(gè)問題,原諒我們能力有限,無法去解決。
問題解決,這里一筆帶過,因?yàn)樵蛱貏e簡(jiǎn)單,TBS服務(wù)(騰訊瀏覽服務(wù))的內(nèi)核基線升級(jí),導(dǎo)致了Angular的在頁(yè)面模板中的管道功能失效。
例如,原先我們?cè)陧?yè)面模板中所使用的代碼為
{{pageDto.balance+0 | number:'1.0-1'}}
經(jīng)過修改后的代碼為
{{pageDto.balance}}
這樣,想要展示的值由后臺(tái)Java進(jìn)行格式化再返回也是可以的(我?guī)滋烨白黾夹g(shù)培訓(xùn),講的是《初探前后端分離》,表達(dá)了,前后端分離的最大好處就是可以平衡壓力,當(dāng)然,我知道分工明確也是很大的優(yōu)點(diǎn)[前者對(duì)物,后者對(duì)人],但是我認(rèn)為其中的一大亮點(diǎn)就是后端僅僅提供原始數(shù)據(jù),而前端可以進(jìn)行數(shù)據(jù)過濾,這樣可以達(dá)到一種"生態(tài)平衡",奈何這種"平衡"現(xiàn)在變得不是那么平衡)。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
解決layer.open彈出框不能獲取input框的值為空的問題
今天小編就為大家分享一篇解決layer.open彈出框不能獲取input框的值為空的問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09JS簡(jiǎn)單實(shí)現(xiàn)String轉(zhuǎn)Date的方法
這篇文章主要介紹了JS簡(jiǎn)單實(shí)現(xiàn)String轉(zhuǎn)Date的方法,涉及JavaScript字符串與日期相互轉(zhuǎn)換的相關(guān)技巧,需要的朋友可以參考下2016-03-03js完美實(shí)現(xiàn)@提到好友特效(兼容各大瀏覽器)
本文給大家分享的是一則使用javascript完美實(shí)現(xiàn)兼容各大瀏覽器的@好友自動(dòng)提示的特效,是根據(jù)百度貼吧的效果模仿來的,推薦給小伙伴們,希望大家能夠喜歡。2015-03-03js獲取元素的偏移量offset簡(jiǎn)單方法(必看)
下面小編就為大家?guī)硪黄猨s獲取元素的偏移量offset簡(jiǎn)單方法(必看)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-07-07JavaScript實(shí)現(xiàn)圖像模糊化的方法實(shí)例
這篇文章主要介紹了JavaScript實(shí)現(xiàn)圖像模糊化的方法,文中先進(jìn)行簡(jiǎn)單介紹,而后給出了完整的實(shí)例代碼,有需要的朋友可以參考借鑒,下面來一起看看吧。2017-01-01微信小程序項(xiàng)目總結(jié)之點(diǎn)贊 刪除列表 分享功能
這篇文章主要介紹了微信小程序項(xiàng)目總結(jié)之點(diǎn)贊 刪除列表 分享功能,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-06-06學(xué)習(xí)并匯集javascript匿名函數(shù)
接觸jQuery很長(zhǎng)時(shí)間了,對(duì)其的實(shí)現(xiàn)有太多疑問,可謂只知道皮毛,對(duì)其的精髓一竅不通,可悲啊!所以有必要研究下其中的原理。2010-11-11JavaScript+Canvas實(shí)現(xiàn)繪制音頻可視化波形圖
這篇文章主要為大家詳細(xì)介紹了如何利用JavaScript和Canvas實(shí)現(xiàn)繪制音頻可視化波形圖,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-02-02Javascript獲取標(biāo)簽ID改變style屬性的代碼
下面的這段代碼中,我們通過select元素的name屬性來設(shè)置具體要訪問style的哪個(gè)屬性(本例中為背景色),這樣,這個(gè)函數(shù)就可以用來設(shè)置不同的CSS屬性了2012-08-08