記一次與a標籤相遇的小事

2022-02-23 16:44:21 字數 2499 閱讀 9399

最近做的乙個專案,按鈕使用的是a標籤做的,樣子還不錯。不過正是這個a標籤把我坑死了,有乙個場景是點選a標籤去調後台服務,為了防止使用者頻繁點選按鈕提交,在去請求後台服務的時候肯定要先把按鈕的事件給禁止掉,後台服務回來之後,要把按鈕變成可以點選的狀態。button有乙個disabled屬性可以禁止按鈕的點選,但是a標籤並沒有這個屬性,disabled對它沒有用。當時想了許久都不知道怎麼去處理這個東西,想過把a標籤換成button,但是一想到要找ui修改demo就不去了,順便增加一下自己這方面的知識。下面寫一下lz面對這一小問題的尷尬經歷。

找了許久的資料,發現都沒有很好的方法符合自己的要求,想到one、off、remove,但是然並卵,去掉之後事件就回覆不來了,真是尷尬。原本自信滿滿的一下子覺的真艱難,後面又去看了看jquery的api有沒有符合的,發現也是木有。lz暫時就在一些只要點選一次的事件使用了one或remove,但是轉念一想不對呀,要是服務報錯了,使用者就點選不了,這要把使用者坑了,把使用者坑了就是把自己坑了。這不相當給自己挖乙個坑,自己跳下去呀,lz肯定不能幹著事情呀。lz馬上覺的還是去一趟wc比較靠譜,放鬆放鬆一下腦子。

回來之後,果然腦子好使了,聯想到自己處理過多次彈框的問題(有多次相同的彈框,場景要求只能彈一次),發現與這個還有點類似,與馬上動手搞。先得有乙個a標籤吧!

<

a class

="btn"

>我就要點多次,你能咋得

a>

要有事件吧!(lz內心暗罵,擦,不要慫,就是幹!)

var isonclick=true;//

預設可以點選 

$(".btn").on(click,function

() )

}

上面就是乙個簡單的過程,不過實現了自己需要的東西。主要就是設定乙個變數來判斷a標籤目前的狀態,說一下主要的流程:

1、首先定義乙個變數isonclick,預設為true.即一進去頁面預設a標籤為可點選狀態。

2、當使用者點選之,立即把isonclick設定為false,這樣使用者多次點選都不會重複執行。

3、當後台服務完成,把isonclick設定為true,這樣a標籤又可以點選了。

完成上面的流程後,a標籤肯定變成這樣了。哈哈,此時lz的心情!!!

<

a class

="btn"

>大哥,我錯了。給點飯吃吧

a>

不過本著精益求精的原則,lz突然想不能點選的時候是不是得有點提示呀,不然使用者不知道,一直在那狂點,沒有撒作用。不得投訴lz的**。肯定會一邊點著滑鼠,一邊把口中暗罵,那個sb寫的**,完全沒有用嘛。此時lz肯定會打了個噴嚏,是誰在想我???想想就覺的全身發抖。以上內容純屬lz瞎逼逼的。吼吼吼,回到問題中來,不過為了讓使用者體驗更好,一般都會在按鈕點選不了之後把按鈕置灰,這也相當與提醒使用者此時按鈕是不可點選的。想到著lz馬上找到ui,給我做乙個置灰的按鈕唄。ui肯定也煩了,一下子這個,一下子那個。這麼簡單的事情都不會(其實這也是lz瞎想的,哈哈,想象力已經豐富到乙個境界了)。其實也就設定了乙個背景顏色,做為乙個後端狗,lz這點還是會的,寫乙個bcakgruond-color嘛,lz數了數,加上-一共16個字母寫錯2個,正確率快到90%了呢。哈哈,正確的寫法是btn-color。現在的a標籤已經變為這樣了。

<

a class

="btn"

>幹嘛不給人家加乙個好看的顏色,嗚嗚

a>

一想到a有樣式了,lz又不爽了,我還是把你幹趴下,不然人生艱難。馬上又寫了一段吊炸天的**(感覺lz真辛酸,這就掉渣天了)。

$(".btn").on(click,function()

}}

發現這個簡單了一點,**控制的好了一點。不過lz還是決定把流程梳理一下,以防有跟我一樣的小夥伴遇到這種問題,為擴大我們的隊伍做貢獻(義正言辭呀)。主要思路是依靠乙個樣式來判斷狀態,主要流程是:

1、先行乙個樣式。樣式可以隨便啦!預設是沒有樣式的啦

2、在js中判斷有沒有這個樣式,有肯定不能讓它進後台了,所以使用了乙個!。

3、沒有就是正常的按鈕,可以放它過去,有就不能讓它過去。

終於把事件解決了,好開心。不過lz也發現好像這個要是直接用瀏覽器修改一下類是不是也可以提交了。這個問題還沒有測試,不過相信lz90%的字母正確率的**是有用的(那來的自信,lz天生自信滿滿),後面測試一下在來考慮這個問題了。打掃戰場,總結經驗,以防止敵人擴大戰線(好嚴肅呀)。回歸正題,雖然這是乙個很簡單的問題,但是也覺的能夠學習到東西,主要是以下幾點:

1、細節與體驗方面也是在寫**不可以錯過的地方。

2、思維方式不能固定,以為button有相應的屬性,a標籤也會有相關的屬性,思維定勢。多個角度思考問題。

3、小問題也要大思考。

lz自身不足:

1、經驗啦!

2、知識面啦!

一說不足就字少了,鄙視自己。哈哈,肯定有人問字母正確率這麼低不是不足嗎???哈哈。

lz與a標籤的相遇就這樣結束啦,小夥伴有沒有更好的做法呢,lz需要集思廣益呢。有的話的請拿起手中的**撥打以下號碼:88888888888

記一次的使用

將jsp拆分frame框架,因為採用了第一種方式,一直在考慮用jquery非同步請求獲取資料,總是但不到效果,終於在js寫吐的時候選擇了第二種方式。參考網上的使用,大多是下面這個樣子,如果涉及靜態頁面之間定位,是沒有問題的 href 為目標頁面 通過target定位到frame views main...

記一次除錯

這是我最近幾個月來遇到的最棘手的乙個問題 昨天花了4個小時找出第一層次的原因 這個糾結啊,本來和老婆說好準時下班回家吃飯的,結果被這個問題拖了老久。這是乙個gradle的plugin,用來resolve公司內部的dependency的,弄完了跑測試專案的,拋乙個npe,而且npe還不在自己的 裡面。...

記一次 EqualsAndHashCode的疑惑

lombok的使用真的是讓開發人員欲罷不能,乙個 data不管有多少屬性全部搞定,以後加字段也不用從新生成get和set方法。不過這裡還是有乙個小坑需要注意一下,舉個例子 public class equalsandhashcodetest data noargsconstructor access...