成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

自學(xué)前端的小白之初次編寫form表單的經(jīng)驗(yàn)與錯誤總結(jié)

JackJiang / 2288人閱讀

摘要：對我這個初學(xué)前端的小白來講，在每次編寫標(biāo)簽的時候經(jīng)常把屬性省略掉，經(jīng)了解標(biāo)簽屬性和屬性是必須有的。五阻止表單提交以及與互換電話這是當(dāng)表單不符合要求時，阻止提交表單的代碼，但寫表單的時候難免會用到，所以要把替換成電話提交

學(xué)了這么久的前端，一直沒有具體總結(jié)自己的經(jīng)驗(yàn)，只有一些記錄在筆記的零星經(jīng)驗(yàn)，今天來這里說說我在初次編寫from表單過程中總結(jié)出的東西：

首先我個人認(rèn)為最難的也是個人認(rèn)為最重要一點(diǎn)：就是當(dāng)我們的程序發(fā)生問題時該怎么解決？

當(dāng)編寫一段代碼的時候，背后總有種種的元素在影響代碼的運(yùn)行效果，而導(dǎo)致錯誤發(fā)生的最具體的原因我把它理解為問題根源，當(dāng)根源找到之后往往所有的問題都會迎刃而解。那怎么才能找到根源的所在呢？第一問人，第二網(wǎng)上查，第三查書，最后一種笨方法就是把所有的影響到的元素全都找出來，一個一個修改代碼排除，往往我們所認(rèn)為正確的其實(shí)它是錯誤的。

廢話少說，下面來看一下我所遇見的問題：

一、關(guān)于標(biāo)簽獨(dú)有屬性 
*{list-style：none;}

這段代碼是我為了省事，把list-style放到了通配符*里面，但這么寫不對，list-style是li標(biāo)簽才有的屬性，應(yīng)該針對li把list-style定位到li:

li{list-style:none;}
二、單選按鈕能被同時選中 
男
女

上面代碼運(yùn)行的時候，會發(fā)現(xiàn)這兩個單選按鈕可以同時被選中，原因是input標(biāo)簽少了一個name屬性。對我這個初學(xué)前端的小白來講，在每次編寫input標(biāo)簽的時候經(jīng)常把name屬性省略掉，經(jīng)了解input標(biāo)簽name屬性和type屬性是必須有的。

男
女

所以只要在input標(biāo)簽加上name屬性就不會發(fā)生單選按鈕能同時選中的尷尬。

三、設(shè)置樣式時發(fā)生沖突

我想要一個輸入框失去焦點(diǎn)的時候，如果里面的內(nèi)容為空的話，邊框變成紅色：

    
    
 
  • 
    
    
 
    •

上面的代碼并沒有實(shí)現(xiàn)預(yù)期的效果，原因是我之前寫樣式的時候加了border:none;,還有我在判斷時出現(xiàn)了錯誤，length是用來保存字符串的長度的，不能拿來判斷value是否為空，應(yīng)該這么寫才對：

    
    
 
  • 
    
    
 
    •
四、正則g的錯誤使用 
    
    
 
  • 
    
    
 
    •

上面代碼是如果輸入不正確的電話號碼時input失去焦點(diǎn)時邊框變紅色，但程序運(yùn)行時我輸入正確的電話號碼，當(dāng)input失去焦點(diǎn)時邊框變黑色再次得到焦點(diǎn)然后再次失去焦點(diǎn)邊框變紅色，原因是我在寫正則的時候用到了全局匹配g，這里g特點(diǎn)是在匹配成功后會記錄匹配成功后的位置，下一次匹配是從上一次匹配成功的末尾位置開始匹配，所以在使用正則匹配時，如果只匹配一個結(jié)果時g就不應(yīng)該出現(xiàn)。

五、阻止表單提交以及submit與div互換

這是當(dāng)表單不符合要求時，阻止提交表單的代碼，但寫表單的時候難免會用到ajax，所以要把submit替換成div：

    

    
    
    
提交

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/91789.html

相關(guān)文章

  • 自學(xué)前端的小白之初次編寫form表單的經(jīng)驗(yàn)與錯誤總結(jié)

    摘要：對我這個初學(xué)前端的小白來講，在每次編寫標(biāo)簽的時候經(jīng)常把屬性省略掉，經(jīng)了解標(biāo)簽屬性和屬性是必須有的。五阻止表單提交以及與互換電話這是當(dāng)表單不符合要求時，阻止提交表單的代碼，但寫表單的時候難免會用到，所以要把替換成電話提交 學(xué)了這么久的前端，一直沒有具體總結(jié)自己的經(jīng)驗(yàn)，只有一些記錄在筆記的零星經(jīng)驗(yàn)，今天來這里說說我在初次編寫from表單過程中總結(jié)出的東西： 首先我個人認(rèn)為最難的也是個人認(rèn)為...

    AaronYuan 評論0 收藏0

  • 自學(xué)前端的小白之初次編寫form表單的經(jīng)驗(yàn)與錯誤總結(jié)

    摘要：對我這個初學(xué)前端的小白來講，在每次編寫標(biāo)簽的時候經(jīng)常把屬性省略掉，經(jīng)了解標(biāo)簽屬性和屬性是必須有的。五阻止表單提交以及與互換電話這是當(dāng)表單不符合要求時，阻止提交表單的代碼，但寫表單的時候難免會用到，所以要把替換成電話提交 學(xué)了這么久的前端，一直沒有具體總結(jié)自己的經(jīng)驗(yàn)，只有一些記錄在筆記的零星經(jīng)驗(yàn)，今天來這里說說我在初次編寫from表單過程中總結(jié)出的東西： 首先我個人認(rèn)為最難的也是個人認(rèn)為...

    cgh1999520 評論0 收藏0

  • 五萬字15張導(dǎo)圖Java自學(xué)路線，小白零基礎(chǔ)入門，程序員進(jìn)階，收藏這篇就夠了

    摘要：本文收錄于技術(shù)專家修煉文中配套資料合集路線導(dǎo)圖高清源文件點(diǎn)擊跳轉(zhuǎn)到文末點(diǎn)擊底部卡片回復(fù)資料領(lǐng)取哈嘍，大家好，我是一條最近粉絲問我有沒有自學(xué)路線，有了方向才能按圖索驥，事半功倍。 ...

    suosuopuo 評論0 收藏0

  • 精彩文章大合集- 收藏集 - 掘金

    摘要：發(fā)布應(yīng)用市場的平臺搶紅包工具紅包精靈開源啦掘金紅包精靈，如果喜歡，點(diǎn)個開源不易。作者將原素材文章進(jìn)行了新內(nèi)容的添加和重新排列，但是因?yàn)槲恼赂咝У拇a編寫技巧總結(jié)前端掘金本文總結(jié)了代碼編寫技巧，來提升你的和代碼。 收藏安卓開發(fā)中非常實(shí)用優(yōu)秀的庫! 有圖有真相! - Android - 掘金本來是打算收藏工具類的,但轉(zhuǎn)念一想,已經(jīng)有這么多優(yōu)秀的庫了,就沒必要再去重復(fù)造輪子了,便歸納工作中比...

    ermaoL 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<