Имеется блок поиска который скрыт. При нажатии на кнопку "S" блок появляется. В нем поле для ввода и 2 кнопки. При вводе текста при нажатии на кнопку - "Х" поле очищается. Вопрос: 1) как сделать чтобы блок появлялся ПЛАВНО сверху вниз? 2) как достучаться до placeholder чтобы при первом нажатии очистки поля, начальное значение его возвращалось? 3) и как при втором клике на кнопку блок плавно уезжал вверх? вот в генераторе пытаюсь: https://jsfiddle.net/tp9y1krj/2/#&togetherjs=5AAE5Uclx3 А вот сам код: Код: <div id="search"> <input id="text" type="text" placeholder = "Поиск по ключевому слову..."> <button id="searchButton" type="button">S</button> <button onclick="clearInput()" id="clearInput" type="button">Х</button> </div> <button onclick="openBlockSearch()" id="searchButton2" type="button">S</button> <script> function clearInput(){ document.getElementById('text').value = " " document.getElementById('text')[0].placeholder = "Поиск по ключевому слову..."; } function openBlockSearch(){ document.getElementById('search').style.display="block"; document.getElementById('search').style.transition="5s"; } </script>
У вас это в ТЗ прописано или мосье просто мазохист? Я уже много раз вам говорил - используйте jQuery! Даже, если б вы знали js на таком уровне, чтоб кодить всё без библиотек - это, как минимум, занимает в разы больше времени.
Ясно. Просто учу JS и думал попробовать решать какие-то задачи без применения библиотек. Но видимо не надо изобретать велосипед)
Научитесь сначала всё самостоятельно решать с библиотеками и тогда сможете переходить к решению без библиотек! Если вы задачу, в принципе, решить не можете, то попытки решить её самым трудным способом ничему вас не научат. Кстати, не думайте, что умение обходится без библиотек сделает вас профессионалом: профессионализм заключается как раз в том, чтоб знать библиотеки на все случаи жизни (и уметь их применять) и быть в состоянии оценить рациональность применения (или не применения) определённой библиотеки в конкретном случае.
Да с jQuery все до безобразия просто, видимо его нужно прокачивать Код: $('#searchButton2').click(function(){ $('#search').slideToggle("slow"); }); $('#clearInput').click(function(){ document.getElementById('text').value = " "; $('#search').slideToggle("slow"); }) и все работает как часы) так кстати можно делать как я написал в плане document.getElementById('text').value = " "; - т.е. в перемешку jQuery и JS? По сути то да, это же его библиотека, но хотелось бы уточнить.
Можно, но нет смысла. Вариант на jQuery короче и надёжней. А надёжней он тем, что в случае отсутствия на странице соответствующего элемента, ваш вариант выдаст TypeError и сломает всё дальнейшее выполнение кода, а jQuery не выдаст ошибок вообще. Смысл использовать getElementById и остальные подобные методы есть только в том случае, если на странице нет ни одной библиотеки, которая может с этим справится (jQuery в этом не уникален). Кстати, а зачем вы при очищении поля туда пробел записываете?
Даже и не знаю)) типа пустое значение, но пробел то тоже имеет свою кодировку. А вместо document.getElementById('text').value = " "; нужно было просто написать $('text').value=(""); - так?
Только оно не пустое. Пробел - такой же символ, как и любой другой, просто он сам по себе визуально не отображается. Не кодировку, а код. Кодировка - это символьная таблица, где каждому символу присвоен определённый код. Совершенно не так! Начиная даже с того, что, как выходит из первоначального кода, text - это у вас id, а вы к нему обращаетесь, как к тегу. И в jQuery не бывает присвоения значений через символ равенства. Смотрите здесь - http://api.jquery.com/val/
Нет. Во-первых, вы кое-что забыли, без чего jQuery вообще не работает. А во-вторых, .val() имеет двойное назначение: через него можно и получить значение и установить. Посмотрите там в доках, как значения именно устанавливаются.
Я тоже стараюсь решать задачи без сторонних плагинов, ибо в них часто бывают ненужные навороты. Но пытаться решать задачи без jQuery - это "копать огород без лопаты" - можно и руками, но долго и муторно...проще купить лопату
