您可能需要退後一秒&請參閱表單驗證的整體圖片。在這裏尋求一個簡單的代碼片段會給你帶來問題,直到你明白你真正需要先做的是什麼。
你會想,如果它無法驗證每個輸入字段&,那麼你要強調的是輸入與紅色邊框&可選的文本消息打開輸入解釋什麼是錯的下方。這個想法是儘可能地對不是程序員的最終用戶友好。
用戶需要知道信用卡號碼字段不能包含字母。或者郵政編碼字段不能爲3個字符。或者電話號碼字段不能是5位數字。他們可能會嘗試添加這些字符,或者意外地在長表單上做錯誤的事情(請考慮:航空公司預訂網站)。因此,您可以爲所有驗證規則創建if/else-if/else或switch/case語句的loooooong列表,但是有一種更好的表單驗證方法。
我推薦的客戶端工作是建立一個正則表達式的JSON對象,它檢查有效輸入字段值的合法模式。 RegEx字符串將根據字符串規則確定用戶的輸入是有效的還是無效的。對於invalids,您可以通過添加「.invalid」類名來標記字段。您也可以使用jQuery打開任何特定的錯誤消息。您仍然希望構建服務器端驗證,但至少預構建的RegEx值很容易在線查找&將有助於簡化您的驗證,以便您不必維護巨大的條件代碼塊(if/else -if/else & switch/case語句)。在條件塊中錯過驗證規則很容易,但RegEx語句會捕獲它們。
因此,人們認爲「正確的方式」可能並不重要。每個人都會有不同的意見。無論適合你&您的網站是正確的方式爲你。最好是批判性地思考你正在構建的東西,以便你將來學習更容易構建表單驗證的技能。
首先查看此RegEx網站的示例部分:http://www.regular-expressions.info或者在網上搜索電子郵件地址,電話號碼,IP地址,郵政編碼,州名縮寫,信用卡號格式等的預製RegEx字符串...您可以測試他們與喜歡的在線工具:http://regexr.com或離線工具,如:正則表達式生成器,這比在:https://sourceforge.net/projects/regexbuilder/
下面是一個例子,這是我幾年前建:http://www.eonline.com/resources/js/libs/eol/eol.regEx.js
我會今天的構建方式不同,但它具有.match()函數+一個啓動器JSON RegEx對象。它展示瞭如何複雜的表單驗證模式匹配。哦,你會想確保將垃圾輸入值保存在數據庫之外。電子郵件如:[email protected]或州名如「XY」或名字如「Darth」,姓氏如「Vader」。祝你好運!
確實讓人困惑。你能多解釋一下嗎? –
你可以創建一個小提琴來說明你的問題? – Blindsyde