fbir
@fbir
начинающий верстальщик

Как в jquery поменять стили у 2х разных блоков?

Нужно после нажатия кнопки 1элементу дать стиль display:none, а второму displey:inline

я попробовал вот так

jQuery(document).ready(function($) {

var contact_left = document.getElementById("contact_left");
var text_contact_left = document.getElementById("text_contact_left");
var btn = document.getElementById("btn");
console.log(window.innerWidth);

btn.onclick = () => .contact_left = (.contact_left == "display:inline")?"display:inline":"display:none";
btn.onclick = () => .text_contact_left = (.text_contact_left == "display:none")?"display:none":"display:inlinee";
};

но оно не работает

вот html
<div class="text_contact_left" id="text_contact_left">
                		<h3>Вы уже заполнили данную форму</h3>
                	</div>
                    <div class="contact_left" id="contact_left">
                        <h3>get in touch</h3>
                        <p>In order to get in touch use the contact form below:
                        </p>
                        <form id="contactForm" action="handler.php" method="post">
                            <input type="text" id="name" name="name" value="name (Required)" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Name';}">
                            <input type="text" id="email" name="email" value="email (Required)" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Email';}">
                            <input type="text" id="phone" name="phone" placeholder="phone (Requered)">
                            <textarea  name="message" id="message" onfocus="if(this.value == 'Your Message here....') this.value='';" onblur="if(this.value == '') this.value='Your Message here....;">Your Message here....</textarea>
                            <span class="btn-right"><input id ="btn" type="submit" value="SEND"></span>
                               <div class="result">
				                       <span id="answer"></span>
				                       <span id="loader"><img src="images/loader.gif" alt=""></span>
		                         	 </div>
                        </form>
                    </div>
  • Вопрос задан
  • 165 просмотров
Пригласить эксперта
Ответы на вопрос 1
l3ftoverz
@l3ftoverz Куратор тега CSS
Люблю Финский металкор
Ваш код синтаксически и логически не правилен.
У вас JQuery, но вы используете её для ready cобытия, а дальше пишете на ванильном JS... WTF?

Если примерно прикинуть, должно быть примерно так:
$(document).ready(function($) {
  $('#btn').click(function (e) {
    $('#contact_left').toggleClass('hide');
    $('#text_contact_left').toggleClass('hide');
  });
};


Ну и нужно добавить в CSS:
.hide {
  display: none;
}


И одному блоку изначально дать этот класс.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы