Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.03.2018, 18:47
Интересующийся
Отправить личное сообщение для TibiTotoro Посмотреть профиль Найти все сообщения от TibiTotoro
 
Регистрация: 02.03.2018
Сообщений: 10

Ошибка с addEventListener на страницах, где нет элемента с id
Здравствуйте!
Есть скрипт, который работает с элементами на одной странице сайта, но подключается на всех. На странице, где скрипт работает все нормально, а на остальных страницах сайта выдается ошибка
Uncaught TypeError: Cannot read property 'addEventListener' of null
at HTMLDocument.<anonymous> (pricecalcen.js?:20)
at i (jquery.js?:2)
at Object.fireWith [as resolveWith] (jquery.js:2)
at Function.ready (jquery.js:2)
at HTMLDocument.K (jquery.js:2)
Код скрипта
jQuery(function($){
	var month = {
				one: {
					quantity:1,
					price: 5,
					rate: 1
				},
				six: {
					quantity:6,
					price: 2,
					rate: 0.5
				},
				twelve: {
					quantity:12,
					price: 1,
					rate: 0.2
				}
			};
	var number = document.getElementById("NumberOfRooms");
	number.addEventListener('click', function(){
		this.value = "";
	});	
	number.onkeydown = function(e) {
				if((e.which >=48 && e.which <=57)  
				|| (e.which >=96 && e.which <=105) 
				|| e.which==8 
				|| (e.which >=37 && e.which <=40) 
   				|| e.which==46) 
				{
				   return true;
				} 
				else {
    				return false;            
					}	
	};			
	number.addEventListener('keyup', function(){
    		NumberOfRooms = $('#NumberOfRooms').val();
				for (var key in month) {
					var summSpan = 'summ' + month[key].quantity;
					var priceSpan = 'price' + month[key].quantity;	
					$('span[id='+priceSpan+']').text(month[key].price.toFixed(2).replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 '));
					$('span[id='+summSpan+']').text((month[key].price * month[key].quantity).toFixed(2).replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 '));
				}
		});	
})

Понятно, что скрипт не видит number, потому что этого элемента просто нет на всех остальных страницах. Но я не могу понять, почему он вообще начинает работать с этим элементом и доводит до ошибки. Мне казалось, что .addEventListener просто регистрирует обработчик, который запускается только если элемент найден и по нему совершено указанное в обработчике действие. Где может быть ошибка?
Ответить с цитированием
  #2 (permalink)  
Старый 02.03.2018, 19:01
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,728

"addEventListener" - метод, не волшебное нечто. У null нет этого метода, отсюда и ошибка.


После 19й строки добавьте это:
if(!number )
    return;
Ответить с цитированием
  #3 (permalink)  
Старый 02.03.2018, 19:20
Интересующийся
Отправить личное сообщение для TibiTotoro Посмотреть профиль Найти все сообщения от TibiTotoro
 
Регистрация: 02.03.2018
Сообщений: 10

Спасибо, помогло. А не подскажите, что в такой ситуации лучше, проверка в самом скрипте, есть ли number, как вы написали или проверка адреса страницы if(window.location.pathname == "/text/"){.....}? Если я точно знаю, что скрипт используется только на 1 странице, но не могу подключать его только на ней?
Ответить с цитированием
  #4 (permalink)  
Старый 02.03.2018, 19:25
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

Если используется на одной странице, конечно производительней проверить страницу, чем создавать объекты и пытаться получать элементы.
Ответить с цитированием
  #5 (permalink)  
Старый 02.03.2018, 19:27
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

Или вынести выше получение элемента и проверку, чтобы не производить лишних телодвижений.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
В событии onClick элемента ошибка при определенном виде передаваемой переменной. rustleofstars Events/DOM/Window 1 25.06.2017 19:08
Переадресация если нет элемента fAmOus Элементы интерфейса 4 12.07.2012 11:42
Ошибка в JS (меню - дерево). Firefox отвергает, остальные нет. ким чен ын Общие вопросы Javascript 2 23.04.2012 17:41
Почему нет движения элемента? DZHETIGAPA Элементы интерфейса 14 20.04.2011 11:15
Где ошибка не пойму Алексей Общие вопросы Javascript 8 30.09.2008 14:57