Javascript, если заявление не вызывает «истинное» утверждение

Question

У меня есть форма многоступенчатый, которая опирается на JavaScript, чтобы определить параметры показать на шаге 2.

Условный оператор должен принимать значение поля электронной почты и должен показать конкретный параметр (элемент div), если домен является @ vip.co.uk и набором общих опций (элемент div), если используется какой-либо другой домен.

Форма работает так, как должна, но я, кажется, вижу общие параметры для всех доменов электронной почты, оператор if не работает.

Ниже приводится заявление If:

function checkEmail(){ 
    var email = document.getElementById('email').value; 
    var idx = email.lastIndexOf('@'); 
    if (idx > -1 && email.slice(idx + 1) === 'vip.co.uk'){ 
     document.getElementById('special').style.display = 'block'; 
     document.getElementById('general').style.display = 'none'; 
    } 
} 

document.getElementById("next").addEventListener("click", checkEmail); 

Учитывая объем кода, который я создал скрипку JS с полной формой в http://jsfiddle.net/zsasvoo4/.

Я очень хочу знать, что я делаю неправильно.

Answer 1

Две вещи:

1. Открыть консоль отладки и вы увидите, что document.getElementById("next") возвращает неопределенное значение. Нет элемента с ID next. Вы можете решить эту проблему, добавив id="next" к кнопке.
2. Если вы используете jQuery, то чаще всего используете $('#next') вместо .getElementById() методов. И, если вы используете jQuery, вы также можете выбрать кнопку с $('[name=next]'), если вы не хотите менять разметку. Полный код, чтобы прикрепить обработчик событий может быть записано как: $('[name=next]').click(checkEmail);