Существует несколько проблем с этим кодом:
Вы действительно не должны использовать один и тот же элемент <script> как для вызова src="javascript.js", так и для одновременного объявления функции. Используйте отдельные элементы, например:
<script type="text/javascript" src="javascript.js"></script>
<script type="text/javascript">
function validation()
{
...
}
</script>
В элементе <form> есть избыточный ;return false. Форма будет принимать значение от return validation(this), все, что после этого будет игнорироваться. Кроме того, нет необходимости ";" при использовании встроенного JavaScript.
Вы передаете this в качестве аргумента функции validation(), но проверка не ожидает аргумента. Должно быть:
function validation(oForm)
Если вы уже передаете this, почему бы не использовать его? this является ссылкой на сам элемент, поэтому для функции проверки это ссылка на форму. Поэтому не нужно называть форму.
<form action="validation.php" method="post" onsubmit="return validation(this)">
И ссылки в функции будут:
function validation(oForm)
{
var fname=oForm["fname"].value;
var lname=oForm["lname"].value;
}
Эти изменения могут решить вашу проблему. Я проверю код дальше, чтобы увидеть, есть ли что-то еще.
EDIT:
Я проверил проверку сейчас, и она работает. Единственная необходимая модификация - это удаление scr=validation.js из вашего <SCRIPT> тега. Для этого используйте отдельные теги, как я и предлагал.
Но я настоятельно рекомендую вам рассмотреть другие вопросы, о которых я упоминал.
Также, другие предложения, касающиеся самой проверки:
Для буквенно-цифровых полей не нужно проверять null, достаточно только "". Вы можете просто использовать:
if (lname=="")
Сообщения об ошибках «Имя» и «Фамилия» совпадают. Это запутает пользователей.
Не проверяйте номера телефонов как числовые. Помните, что "(407) 234-5678" - это совершенно допустимый номер телефона, хотя он не пройдёт тест. Если у вас нет веских причин считать его числовым (автоматический набор?), Оставьте его как обычное текстовое поле.
В поле National ID: в HTML нет minlength. Только maxlength
isNaN(idnumber) вернет true, если значение будет пустым. А также если длина <8. Я предполагаю, что это обязательное поле требуемой длины, поэтому вы должны использовать: </p>
if (isNaN(idnumber) || idnumber.length != 8)
{
alert("Please enter a valid id number");
return false;
}
Для всех ваших тестов, подумайте об обрезке значений. В настоящее время ввод, подобный "" (только пробелы), пройдет ваш тест. Javascript не имеет встроенной функции обрезки, но это можно сделать с помощью этого:
функция обрезки (текст) {
return texto.replace(/^\s*|\s*$/g, "");
}
И используется так:
var fname=trim(oForm["fname"].value);
- Для ясности используйте явное
return true; в validation() после всех успешных испытаний.
Вот предлагаемый код после всех изменений:
<script type="text/javascript" scr="validation.js"></script>
<script type="text/javascript">
function validation(oForm)
{
var fname = trim(oForm["fname"].value);
var lname = trim(oForm["lname"].value);
var idnumber = trim(oForm["idnumber"].value);
var email = trim(oForm["email"].value);
var atpos = email.indexOf("@");
var dotpos = email.lastIndexOf(".");
var address = trim(oForm["address"].value);
var phonenumber = trim(oForm["phonenumber"].value);
if (fname=="")
{
alert("First name should be entered");
return false;
}
if (lname=="")
{
alert("Last name should be entered");
return false;
}
if (isNaN(idnumber) || idnumber.length != 8)
{
alert("Please enter a valid id number");
return false;
}
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
{
alert("Please enter a valid e-mail address");
return false;
}
if(address=="")
{
alert("Please insert your address");
return false;
}
if (isNaN(phonenumber))
{
alert("Please enter a valid phone number");
return false;
}
return true;
}
function trim( texto ) {
return texto.replace(/^\s*|\s*$/g, "");
}
</script>
<form name="form1" action="validation.php" method="post" onsubmit="return validation(this)">
Firstname:<input type="text" name="fname"><br/>
Lastname:<input type="text" name="lname"><br/>
Nation ID Number:<input type="text" name="idnumber" maxlength="8"><br/>
Email address: <input type="text" name="email"><br/>
Address:<input type="text" name="address"><br/>
Pnone number:<input type="text" name="phonenumber"><br/>
<input type="reset" name="reset" value="reset">
<input type="submit" name="submit" value="submit">
</form>