如何使用正則表達式來驗證表單輸入javascript

我是使用JavaScript的初學者，我已經閱讀過RegExp的文檔並去了幾個例子，但我無法弄清楚如何正確使用它。我有一個包含5個輸入字段的表單。 我需要使用RegExp來驗證用戶輸入的形式。禁止值爲如何使用正則表達式來驗證表單輸入javascript

（）{}'！＃「\/

允許其他字符，但在提交表單前必須輸入所有輸入字段（不允許空白/空字段）。

輸入字段id =「unos_naziv_proizvoda」必須包含至少5個字符並以大寫字母開頭。輸入字段id =「unos_opis_proizvoda」必須包含至少3個句子。句子以大寫字母開頭並以點結束。輸入字段id =「unos_datum_proizvodnje」，這是製造的日期必須DD.MM.YYYY的形式，不能在未來（必須小於或相同，今天），並且必須是類型文本

這裏是HTML代碼：

<form id="forma_prijava" class="forma_novi_proizvod" action="http://barka.foi.hr/WebDiP/2016/materijali/zadace/ispis_forme.php" method="POST"> 
      <label for="unos_naziv_proizvoda">Naziv proizvoda</label> 
     <input type="text" name="naziv_proizvoda[15]" id="unos_naziv_proizvoda" placeholder="Unesite naziv proizvoda" maxlength="15"> 
      <label for="unos_opis_proizvoda">Opis proizvoda</label> 
     <textarea name="opis_proizvoda" id="unos_opis_proizvoda" placeholder="Ovdje unesite opis proizvoda" rows="50" cols="100"></textarea> 
      <label for="unos_datum_proizvodnje">Datum proizvodnje</label> 
     <input type="date" name="datum_proizvodnje" id="unos_datum_proizvodnje"> 
      <label for="unos_vrijeme_proizvodnje">Vrijeme proizvodnje</label> 
     <input type="time" name="vrijeme_proizvodnje" id="unos_vrijeme_proizvodnje"> 
      <label for="unos_kolicina_proizvodnje">Količina proizvodnje</label> 
     <input type="number" name="kolicina_proizvodnje" id="unos_kolicina_proizvodnje" placeholder="Unesite količinu proizvodnje" min="1"> 

      <button type="Submit" value="Submit">Dodaj proizvod</button> 
      <button type="Reset" value="Reset">Poništi unos</button> 
     </form>

這裏是js代碼：

window.onload = function(){ 
    var provjeri = function(){ 
     var re = new RegExp(/[^(){}'!#"\/]/, g); 
     var uzorak = document.getElementById("forma_prijava"); //id of a form // 
     var ok = re.test(uzorak.value); 
     if(!ok){ 
      alert("Niste unijeli valjani tekst"); //alert message if it's not valid input // 
      return false; 
     } 
     else{ 
      alert("OK"); // message if it's valid input // 
      return true; 
     } 
    }; 
    document.getElementById("forma_prijava").addEventListener("oninput", provjeri); 
};

我不知道我應該使用它的整體形式爲一個單元或者在每個輸入字段分開，因爲我有不同的類型的輸入字段（兩個是文字，其他是日期，時間和數字）。如果有人在提供示例時能夠提供更易於理解的解釋，我會很感激。 :) 只是再次指出，我嚴格要使用RegExp（純JavaScript），沒有其他圖書館或框架不記得！提前謝謝！

來源

2017-06-06 karlo1zg

表單元素不具有值屬性... – evolutionxbox

你不需要使用JavaScript在所有驗證在客戶端輸入字段。對於html5，'input'元素已經有了一個接受正則表達式的模式屬性。另外請記住，在客戶端進行驗證是不夠的（並且或多或少是無用的），因爲您必須在服務器端系統地進行驗證。 –

另一方面，你的模式'/ [^（）{}'！＃「\ /] /'是錯誤的，因爲它只檢查一個字符串是否有**一個**字符不是'（'，' ），''，''，''''，''，'！'，'＃'，''''或'/'。 –

您可以使用輸入標籤的財產pattern

<input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code">

來源

2017-06-06 10:58:51 Simo

如何使用正則表達式來驗證表單輸入javascript

回答

相關問題