Javascript驗證兩個文本框

Question

下面的代碼驗證兩個名稱服務器文本框。正如你可以看到JavaScript代碼中有冗餘。 // validate textbox 1和// validate textbox 2。無論如何，我可以只使用一個腳本..你知道我只是想使用1驗證功能來驗證兩個文本框。我很抱歉我的英語，我希望你們都能理解我。謝謝。

<script type="text/javascript"> 

// validate textbox 1 
    function validate_domain(){ 
     var nameserver1 = document.getElementById('nameserver1').value; 
     var domain_array = nameserver1.split('.'); 

     var domain = domain_array[0]; 
    //This is reguler expresion for domain validation 
     var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/; 

    if(domain == ''){ 
     alert("Please enter the domain name"); 
     document.getElementsById('nameserver1').focus(); 
     return false; 
    } 

    if(reg.test(domain) == false){ 
     alert("Invalid character in domain. Only letters, numbers or hyphens are allowed."); 
     document.getElementsById('nameserver1').focus(); 
     return false; 
    } 

    } 



    // validate textbox 2 
    function validate_domain(){ 
     var nameserver1 = document.getElementById('nameserver1').value; 
     var domain_array = nameserver2.split('.'); 

     var domain = domain_array[0]; 
    //This is reguler expresion for domain validation 
     var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/; 

    if(domain == ''){ 
     alert("Please enter the domain name"); 
     document.getElementsById('nameserver2').focus(); 
     return false; 
    } 

    if(reg.test(domain) == false){ 
     alert("Invalid character in domain. Only letters, numbers or hyphens are allowed."); 
     document.getElementsById('nameserver2').focus(); 
     return false; 
    } 

    } 
    </script> 

<fieldset class="inlineLabels"> 

      <label for="name">Nameserver 1</label> 
      <input type="text" class="textInput" maxlength="255" size="30" value="" id="nameserver1" name="nameserver1"> 

      <label for="data">Nameserver 2</label> 
      <input type="text" class="textInput" maxlength="255" size="30" value="" id="data" name="nameserver2"> 

     </fieldset> 

      <button onclick="validate_domain(); submitForm('page1','directpage.php');" value="Validate" name="btn_validate" type="button" class="positive iconstxt icoPositive"><span>Save</span></button> 

Answer 1

那麼這裏是另一種方法：

function ValidateDomain(){ 
    function CheckForBlank(domain, textBox){ 
     if(domain == ''){ 
      alert("Please enter the domain name"); 
      document.getElementsById('nameserver1').focus(); 
      return false; 
     } 
    } 
    function CheckForFormat(domain, textBox){ 
     if(reg.test(domain) == false){ 
      alert("Invalid character in domain. Only letters, numbers or hyphens are allowed."); 
      document.getElementsById('nameserver1').focus(); 
      return false; 
     } 
    } 
    function GetDomainName(inputId){ 
     var serverName = document.getElementById(inputId).value, 
      domain_array = serverName.split('.'); 

     return domain_array[0]; 
    } 
    var nameserver1 = GetDomainName('nameserver1'), 
     nameserver2 = GetDomainName('nameserver2'), 
     nameServerInput1 = document.getElementsById('nameserver1'); 
     nameServerInput2 = document.getElementsById('nameserver2'); 

    if (CheckForFormat(nameserver1,nameServerInput1) && CheckForBlank(nameserver1,nameServerInput1) 
     && CheckForFormat(nameserver2,nameServerInput2) && CheckForBlank(nameserver2,nameServerInput2)){ 
     //This means you are valid 
     return { 
      name1:nameserver1, 
      name2:nameserver2 
     } 
    } 
    return false; 
} 

Answer 2

也許是這樣的：

<script type="text/javascript"> 

function validate_domain(){ 

      validateTextBox('nameserver1'); 
      validateTextBox('nameserver2'); 
} 

     function validateTextBox(tbName){ 

       var nameserver1 = document.getElementById(tbName).value; 
       var domain_array = nameserver1.split('.'); 

       var domain = domain_array[0]; 
      //This is reguler expresion for domain validation 
       var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/; 

      if(domain == ''){ 
       alert("Please enter the domain name"); 
       document.getElementsById(tbName).focus(); 
       return false; 
      } 

      if(reg.test(domain) == false){ 
       alert("Invalid character in domain. Only letters, numbers or hyphens are allowed."); 
       document.getElementsById(tbName).focus(); 
       return false; 
      } 

      } 

     } 
      </script> 

Answer 3

帶你想驗證作爲函數的參數元素的ID。

// validate textbox 
function validate_domain(serverName){ 
    var server = document.getElementById(serverName).value; 
    var domain_array = server.split('.'); 

    var domain = domain_array[0]; 
//This is reguler expresion for domain validation 
    var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/; 

if(domain == ''){ 
    alert("Please enter the domain name"); 
    document.getElementsById(serverName).focus(); 
    return false; 
} 

if(reg.test(domain) == false){ 
    alert("Invalid character in domain. Only letters, numbers or hyphens are allowed."); 
    document.getElementsById(serverName).focus(); 
    return false; 
} 

} 

Answer 4

<script type="text/javascript"> 

// validate textbox 
    function validate_domain(ele){ 
     var nameserver = ele.value; 
     var domain_array = nameserver.split('.'); 

     var domain = domain_array[0]; 
    //This is reguler expresion for domain validation 
     var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/; 

    if(domain == ''){ 
     alert("Please enter the domain name"); 
     ele.focus(); 
     return false; 
    } 

    if(reg.test(domain) == false){ 
     alert("Invalid character in domain. Only letters, numbers or hyphens are allowed."); 
     ele.focus(); 
     return false; 
    } 

    } 
    </script> 

<fieldset class="inlineLabels"> 

      <label for="name">Nameserver 1</label> 
      <input type="text" class="textInput" maxlength="255" size="30" value="" id="nameserver1" name="nameserver1"> 

      <label for="data">Nameserver 2</label> 
      <input type="text" class="textInput" maxlength="255" size="30" value="" id="data" name="nameserver2"> 

     </fieldset> 

      <button onclick="validate_domain(document.getElementById('nameserver1')); validate_domain(document.getElementById('nameserver2')); submitForm('page1','directpage.php');" value="Validate" name="btn_validate" type="button" class="positive iconstxt icoPositive"><span>Save</span></button> 

Answer 5

看到這一個工作。在家玩。這是一個工作jsFiddle。是的，這太複雜了，但我討厭alert('annoying pop-up');。

我評論了源代碼，所以你會更好地理解爲什麼我這樣寫。

sg522：它可能不會複製/粘貼到您的代碼和工作，但我不知道你的代碼的其餘部分是什麼。我們也不是在這裏爲你寫代碼。我們在這裏幫助您學習併成爲更有經驗的程序員。

如果您有任何問題，請讓我們知道。

快樂編碼！

更新：修改jsFiddle與Opera和Firefox 10配合使用。 Opera或Firefox顯然不允許cloneNode現在不帶參數調用。 Opera顯然也不允許鏈接變量聲明。