Шрифт:
Аналогично, функция lastIndexOf возвращает позицию последнего вхождения одной строки в другую. 'abcba'.lastIndexOf('a') вернет 4, в то время как 'abcba'.indexOf('a') вернет 0.
Поэтому в нашем коде первый оператор if проверяет, что в адресе e-mail имеется хотя бы один символ '@'. Если такого символа нет, то email.indexOf('@') вернет – 1 и оператор if вернет false.
Следующий оператор соединяет indexOf и lastIndexOf. Если в адресе e-mail имеется более одного символа @, то две эти функции вернут различные значения, как в приведенном выше примере с 'abcba'. Если имеется только один символ @, то эти функции вернут одно и то же значение. Поэтому мы проверяем эти значения на неравенство.
Третий оператор по сути идентичен первому, только он проверяет '.', а не '@'.
Наконец, четвертый оператор if проверяет, что в адресе e-mail имеется как минимум одна точка после символа @.
Недостаток этого метода состоит в том, что простая строка "@." пройдет проверку. Должно быть очевидно, что она не является допустимым адресом e-mail. Существует другой метод для проверки адреса e-mail и для проверки множества других вещей. Это делается с помощью так называемых "регулярных выражений". Хотя регулярные выражения здесь рассматриваться не будут, ниже приведен пример проверки адреса e-mail, который остается читателю для анализа в качестве упражнения.
function validateForm{
var email = document.forms.tutform.elements.email.value;
if(!(/^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.
[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$/.test(email))){
alert('Пожалуйста, введите допустимый адрес e-mail');
return false;
}
return true;
}
Как можно видеть, использование регулярного выражения приводит к более короткому (и более надежному) коду проверки, но он является и существенно более сложным!
С помощью примеров этой лекции теперь можно создать одну функцию для проверки всей формы:
function tut7{
var form_object = document.forms.tutform;
var radios = document.forms.tutform.elements.color;
var email = document.forms.tutform.elements.email.value;
if(form_object.elements.firstname.value == "){
alert('Вы должны ввести свое имя!');
return false;
} else if(form_object.elements.lastname.value == "){
alert('Вы должны ввести свою фамилию!');
return false;
} else if(email.indexOf('@')<0){
alert('В адресе e-mail должен быть символ @');
return false;
} else if(email.indexOf('@') != email.lastIndexOf('@')){
alert('В адресе e-mail не может быть более одного символа @');
return false;
} else if(email.indexOf('.')<0){
alert('В адресе e-mail должна быть как минимум одна точка');
return false;
} else if(email.lastIndexOf('.')<email.indexOf('@')){
alert('В адресе e-mail должна быть как минимум одна точка после символа @');
return false;
}
for(var i=0; i<radios.length; i++){
if(radios[i].checked) return true;
}
alert('Необходимо выбрать цвет!');
return false;
}
Лекция 4. Функции и концепция объектов
В предыдущей лекции мы рассмотрели основы работы с полями форм и немного познакомились с функциями. Если какие-то из этих понятий вызывают затруднения, то желательно еще раз прочитать последнюю лекцию.
Как мы уже знаем, функции в JavaScript используются для многократного выполнения одной и той же задачи. До сих пор функции всегда вызывались вручную с помощью скобок: myFunction. Что, если потребуется вызвать функцию, когда пользователь выполняет определенную задачу? В JavaScript можно соединить функцию практически с любым событием, которое может порождать пользователь. Давайте посмотрим это в действии и напишем функцию, которая подсчитывает, сколько раз пользователь щелкнул на странице.