Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Обработчик события срабатывает без события! Подскажите пожалуйста (https://javascript.ru/forum/events/64849-obrabotchik-sobytiya-srabatyvaet-bez-sobytiya-podskazhite-pozhalujjsta.html)

opawina 09.09.2016 10:49

Обработчик события срабатывает без события! Подскажите пожалуйста
 
Здравствуйте знатоки!
Подскажите пожалуйста. При запуске страницы должен отображаться только первый div id=div_log_in. Второй div id=div_registration_user должен отображается после нажатия на кнопку button id=new_user_button и скрывать первый div. В скрипте прописана функция которая скрывает все не нужные div и показывает тот который нам нужен. Так вот. Обработчик кнопки срабатывает без нажатия на эту кнопку, т.е. при запуске сразу скрывается первый div и показывается второй. На 52й строчке как раз срабатывает обработчик. А этого не надо делать.
Благодарю!

<body>

	<div id="div_log_in" class="bblock">
		<p>Enter your name
			<input type="text" name="" id="name_user2">
		</p>
		<p>Enter your password
			<input type="text" name="" id="password_user2">
		</p>
		<p>
			<input type="button" name="" value="Log in" id="login_button">
			<input type="button" name="" value="New user" id="new_user_button">
		</p>
	</div>

	<div id="div_registration_user" class="bblock">
		<p>Enter your name
			<input type="text" name="" id="name_user">
		</p>
		<p>Enter your password
			<input type="text" name="" id="password_user">
		</p>
		<p>Enter your email
			<input type="text" name="" id="email_user">
		</p>
		<p>Choose your role
			<select name="" id="role_user">
				<option value="customer">Покупатель</option>
				<option value="contractor">Поставшик</option>
			</select>
		</p>
		<p>
			<input type="button" name="" value="Registration" id="registration_user_button">
		</p>
	</div>

	<script>
		//ОТОБРАЖЕНИЕ БЛОКА div С КОТОРЫМ МЫ РАБОТАЕМ И СКРЫТИЕ ОСТАЛЬНЫХ
		function func_display_div(work_div) {
			var all_div = document.getElementsByClassName('bblock');
			for (var i = 0; i < all_div.length; i++) {
				all_div[i].style.display = 'none';
			}
			work_div.style.display = 'block';
		}

		//НАЧАЛО СЦЕНАРИЯ. ОТОБРАЖАЕТСЯ БЛОК DIV_LOG_IN
		func_display_div(div_log_in);

		// BUTTON NEW USER. СКРЫТИЕ БЛОКА DIV_LOG_IN И ОТОБРАЖЕНИЕ БЛОКА DIV_REGISTRATION_USER
		var new_user = document.getElementById('new_user_button');
*!*
		new_user.addEventListener("click", func_display_div(div_registration_user));
*/!*
	</script>
</body>

Manyasha 09.09.2016 11:03

opawina,
в addEventListener нужно подавать функцию, а не ее результат
new_user.addEventListener("click", function(){
				func_display_div(div_registration_user)
		});

opawina 10.09.2016 11:07

Сработало! Благодарю!

warren buffet 11.09.2016 06:49

Не мучайте задницу. Тут нет никакого смысла передавать аргумент div_registration_user. Сделай его где-нибудь уже и тогда new_user.addEventListener("click", func_display_div);


Часовой пояс GMT +3, время: 16:31.