@ChikiBOBONI

Всплывающий блок при клике на input не хочет сварачиваться назад, что делать?

ребята такая проблема, есть два input и один textarea нужно что бы при клике на поле текст уезжал вверх этих полей, вот мой код

HTML
<form action="handler.php" method="post" id="reply">
<div id="content1" style="display: none;">Ваше имя</div>
<div class="Content-Top2-1"><input id="link1" type="text" name="name" class="text" id="name" value="Ваше имя" onfocus="if (this.value=='Ваше имя') this.value='';" onblur="if (this.value==''){this.value='Ваше имя'}"/></div>
<div id="content2" style="display: none;">Способ связи</div>
<div class="Content-Top2-4"><input id="link2" type="text" name="email" class="text" id="name" value="Способ связи" onfocus="if (this.value=='Способ связи') this.value='';" onblur="if (this.value==''){this.value='Способ связи'}"/></div>
<div id="content3" style="display: none;">Задача</div>
<div class="Content-Top2-2"><textarea id="link3" name="text" id="comment" placeholder="Задача" cols="28" rows="15" ></textarea></div>
<div class="Content-Top2-3"><input type="submit" class="button" value="Отправляем"><img src="images/Strelka.jpg"></div>
</form>


javascript
<script>
    $(document).ready(function () {
        $('textarea#link3').click(function (e) {
            $(this).toggleClass('active');
            $('#content3').toggle();
                 
            e.stopPropagation();
        });
        $('body,input').click(function () {
            var link = $('textarea#link3');
            if (link.hasClass('active')) {
                link.click();
            }
        });
    });
</script>

<script>
    $(document).ready(function () {
        $('input#link1').click(function (e) {
            $(this).toggleClass('active');
            $('#content1').toggle();
                 
            e.stopPropagation();
        });
        $('body,.Content-Top2-2').click(function () {
            var link = $('input#link1');
            if (link.hasClass('active')) {
                link.click();
            }
        });
    });
</script>

<script>
    $(document).ready(function () {
        $('input#link2').click(function (e) {
            $(this).toggleClass('active');
            $('#content2').toggle();
                 
            e.stopPropagation();
        });
        $('body,#link1,textarea').click(function () {
            var link = $('input#link2');
            if (link.hasClass('active')) {
                link.click();
            }
        });
    });
</script>


при клике в body все нормально сварачивается назад но при клике на другое поле инпут или текстера оно не хочет сварачиваться, помогите пожалуйста чайнику
  • Вопрос задан
  • 275 просмотров
Пригласить эксперта
Ответы на вопрос 2
orlov0562
@orlov0562
I'm cool!
выложи на jsfiddle, так проще тебе помочь будет

на первый взгляд, тебе надо добавить ко всем появляющимся объектам единый класс, и потом скрывать его перед показом нового, т.е. что-то типа:
<div class="panel" id="panel-1"></div>
  <div class="panel" id="panel-2"></div>


$('#btn-panel-1').click(function(){
    $('.panel:visible').hide();
    $('#panel-1').show();
  });

  $('#btn-panel-2').click(function(){
    $('.panel:visible').hide();
    $('#panel-2').show();
  });


идея думаю понятна
Ответ написан
Комментировать
@ChikiBOBONI Автор вопроса
нашел кое что
<input href="#div1" id="" class="link">
  <input href="#div2" class="link">
  <input href="#div3" class="link">
  <input href="#div4" class="link">
  <div class="bar" id="div1">asdasdasdasd</div>
  <div class="bar" id="div2">asdasdasd</div>
  <div class="bar" id="div3">asdasdasd</div>
  <div class="bar" id="div4">asdasdasdad</div>


$(function() {
    $('.link').on('click', function(e) {
        e.preventDefault();
        $('.bar').each(function() {
            $(this).css('display', 'none');
        });
        var block = $(this).attr('href');
        $(block).css('display', 'block');
    });
});


только как теперь сделать что бы блоки скрывались на нажатие на любом месте, а не только по нажатию на input ?
Ответ написан
Ваш ответ на вопрос

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

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