javascript表單驗證對象

請讓我剛開始學習javascript，以建立我的技能。我給了自己一個JavaScript項目來構建一個對象驗證器。我創建的第一個方法是checkEmpty。此方法檢查空字段。但由於不知道我的方法不起作用。javascript表單驗證對象

這是HTML形式

<form name="myForm"> 

     <input type="text" class="required email" name='fName'/> 
     <input type="text" class="required number" name="lName"/> 

     <input type="submit" value="submit" name="submit" id="submit"/> 

    </form>

這是稱爲驗證對象

window.onload = function(){ 
var validate = new FormValidator('myForm');  
var submit = document.getElementById('submit'); 

    //this method won't work for internet explorer 
submit.addEventListener('click',function(){return checkLogic();},false); 
var checkLogic = function(){ 
    validate.checkEmpty('fName');     
}; 

    }

這就是所謂的javascript對象的JavaScript Formvalidation

function FormValidator(myForm){ 
    //check ur error in stack overflow; 
    this.myForm = document.myForm; 

    this.error = ''; 

    if(typeof this.myForm === 'undefined'){ 

     alert('u did not give the form name '); 
     return; 
    } 


    }

//該方法將檢查wheather一個字段爲空或不

FormValidator.prototype.checkEmpty = function(oEmpty){ 
    var oEmpty = this.myForm.oEmpty; 
    if(oEmpty.value === '' || oEmpty.value.length === 0){ 
    this.error += "Please Enter a valid Error Message \n"; 

     } 
    FormValidator.printError(this.error); 

    };

此方法印出誤差;

 FormValidator.printError = function(oData){ 
     alert(oData); 
    };

來源

2013-02-28 EBIWARI

在控制檯上的任何錯誤？ – sasi 2013-02-28 13:22:59

格式化代碼後，它更容易找出問題所在。我假設你正在嘗試驗證你的html代碼中的輸入字段。

你的代碼是在它的鼻子第一次落在方法checkEmpty（）的1號線：

FormValidator.prototype.checkEmpty = function(oEmpty){ 
    var oEmpty = this.myForm.oEmpty; 
    if(oEmpty.value === '' || oEmpty.value.length === 0){ 
     this.error += "Please Enter a valid Error Message \n"; 

    } 
    FormValidator.printError(this.error); 
};

在第一行，你是從1號線隱藏方法參數oEmpty用var oEmpty聲明

還有其他一些問題，如過度使用方法和成員。下面的代碼也可能是你想要的東西：

1）的index.html

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"/> 
    <title></title> 
</head> 
<body> 
    <form name="myForm"> 
     <input id="fName" name='fName' type="text"/> 
     <input id="lName" name="lName" type="text"/> 
     <input id="submit" name="submit" type="submit" value="submit"/> 
    </form> 
    <script src="main.js"></script> 
</body> 
</html>

2）main.js

function InputFieldValidator(inputFieldName){ 
    this.inputFieldName = inputFieldName; 
    this.inputField = document.getElementById(this.inputFieldName); 
    if(this.inputField === 'undefined'){ 
     alert('No input field: ' + this.inputFieldName); 
    } 
} 

InputFieldValidator.prototype.validate = function(){ 
    if(this.inputField.value === ''){ 
     alert('Please enter valid text for input field: ' + this.inputFieldName); 
    } 
}; 

window.onload = function(){ 
    var fNameValidator = new InputFieldValidator('fName'), 
     lNameValidator = new InputFieldValidator('lName'), 
     submitButton = document.getElementById('submit'); 

    submitButton.addEventListener('click', function(){ 
     fNameValidator.validate(); 
     lNameValidator.validate(); 
    }); 
};

如果你喜歡，你可以從包裝輸入字段驗證上面很容易在一個表單驗證器。

來源

2013-02-28 14:58:16

這是定義函數這樣的正確方法：

var FormValidator = function(myForm){ /* function body */ }; 
    FormValidator.prototype.checkEmpty = function(oEmpty){ /* function body */ };

比，實例化對象後，就可以調用FormValidator.checkEmpty(value)像你這樣。

來源

2013-02-28 13:23:47

謝謝，但我不認爲這是問題 – EBIWARI 2013-02-28 13:41:20

javascript表單驗證對象

回答

相關問題