微信小程序-自定義彈出層和仿微信密碼輸入框

html

js:

hideFlag: function () { this.setData({ flag: false }) }

toSetPasswprd: function (e) {

? ? var that = this;

? ? this.setData({

? ? ? password: e.detail.value,

? ? ? passwordLength: e.detail.cursor

? ? })

? ? if (e.detail.cursor == 6) {//do something }

? }

css:

.password-box { margin: 0 auto; border: 1px solid #ddd; border-right: 0; width: 240px; height: 40px;} .password-sigle { width: 40px; height: 40px; text-align: center; font-size: 24px; box-sizing: border-box; float: left; padding: 0px; border-right: 1px solid #ddd;} .password-sigle i { width: 10px; height: 10px; background-color: #000; border-radius: 20px; display: block; margin: 15px auto;} .password-title { text-align: center; display: block; padding-top: 20px;} .password-text-warn { font-size: 12px; margin-bottom: 10px; display: block; text-align: center;} .cash-password-main { padding: 30px 0; position: relative;} .password-input { position: absolute; left: 50%; right: 50%; border: 1px solid #ddd; width: 240px; height: 40px; margin-left: -120px; font-size: 24px; top: 30px; opacity: 0;} .cash-pop-notice { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5);} .cash-pop-main { background-color: #fff; width: 270px; height: 150px; text-align: center; position: absolute; top: 20%; left: 50%; right: 50%; margin-left: -135px;} .pop-main-icon { position: absolute; right: 10px; top: 10px;} .cash-pop-title { padding-top: 25px;}

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末莺治,一起剝皮案震驚了整個(gè)濱河市单起,隨后出現(xiàn)的幾起案子肥惭,更是在濱河造成了極大的恐慌端姚,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,734評(píng)論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡编整,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,931評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門乳丰,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)掌测,“玉大人,你說(shuō)我怎么就攤上這事产园」” “怎么了?”我有些...
    開封第一講書人閱讀 164,133評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵淆两,是天一觀的道長(zhǎng)断箫。 經(jīng)常有香客問(wèn)我,道長(zhǎng)秋冰,這世上最難降的妖魔是什么仲义? 我笑而不...
    開封第一講書人閱讀 58,532評(píng)論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮剑勾,結(jié)果婚禮上埃撵,老公的妹妹穿的比我還像新娘。我一直安慰自己虽另,他們只是感情好暂刘,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,585評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著捂刺,像睡著了一般谣拣。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上族展,一...
    開封第一講書人閱讀 51,462評(píng)論 1 302
  • 那天森缠,我揣著相機(jī)與錄音,去河邊找鬼仪缸。 笑死贵涵,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的恰画。 我是一名探鬼主播宾茂,決...
    沈念sama閱讀 40,262評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼拴还!你這毒婦竟也來(lái)了跨晴?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,153評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤片林,失蹤者是張志新(化名)和其女友劉穎端盆,沒(méi)想到半個(gè)月后树瞭,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,587評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡爱谁,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,792評(píng)論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了孝偎。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片访敌。...
    茶點(diǎn)故事閱讀 39,919評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖衣盾,靈堂內(nèi)的尸體忽然破棺而出寺旺,到底是詐尸還是另有隱情,我是刑警寧澤势决,帶...
    沈念sama閱讀 35,635評(píng)論 5 345
  • 正文 年R本政府宣布阻塑,位于F島的核電站,受9級(jí)特大地震影響果复,放射性物質(zhì)發(fā)生泄漏陈莽。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,237評(píng)論 3 329
  • 文/蒙蒙 一虽抄、第九天 我趴在偏房一處隱蔽的房頂上張望走搁。 院中可真熱鬧,春花似錦迈窟、人聲如沸私植。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,855評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)曲稼。三九已至,卻和暖如春湖员,著一層夾襖步出監(jiān)牢的瞬間贫悄,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,983評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工破衔, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留清女,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,048評(píng)論 3 370
  • 正文 我出身青樓晰筛,卻偏偏與公主長(zhǎng)得像嫡丙,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子读第,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,864評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容

  • 各種純css圖標(biāo) CSS3可以實(shí)現(xiàn)很多漂亮的圖形曙博,我收集了32種圖形,在下面列出怜瞒。直接用CSS3畫出這些圖形父泳,要比...
    劍殘閱讀 9,546評(píng)論 0 8
  • 不會(huì)用代碼框般哼,所以看著有些亂套,惠窄,蒸眠,,html部分 <!DOCTYPE html> 迅雷看看 ...
    這就是個(gè)帥氣的名字閱讀 1,534評(píng)論 0 0
  • 1杆融、垂直對(duì)齊 如果你用CSS楞卡,則你會(huì)有困惑:我該怎么垂直對(duì)齊容器中的元素?現(xiàn)在脾歇,利用CSS3的Transform蒋腮,...
    kiddings閱讀 3,164評(píng)論 0 11
  • 新學(xué)期剛剛開學(xué)激况,熊孩子們就開始刺激老師和家長(zhǎng)們緊張脆弱的神經(jīng)了作彤。因?yàn)榻徊簧虾僮鳂I(yè),他們花招迭出乌逐,也是蠻拼的宦棺。有的...
    老吶閱讀 208評(píng)論 0 1
  • 也許這個(gè)世上存在著很多不公平的事情,也許你會(huì)遭遇到很多不公平的待遇黔帕,但有一個(gè)東西是最公平的代咸,它是所有不公平的起源,...
    令宜閱讀 498評(píng)論 0 0