Все технические форумы на одном сайте Удобный поиск информации с популярных форумов в одном месте
Вопрос: Исчезает клавиатура при клике на input

Всем доброго времени суток. Возможно не в этот раздел добавляю тему...
Создал сайт, тестирую. Возник трабл есть input в модальном окне.

Если в него поставить курсор на Андройд устройстве то на секунду появляется клавиатура, а затем исчезает.
При этом на apple, windows и любых pc нормально работает.

В какую сторону копать?
Ответ:
Чуть больше подробностей пожалуйста.

Ты касаешься инпута на экране телефона
появляется клавиатура (возможно что ты этого не замечаешь)
в этот же самый момент ты делаешь append
инпут переносится в другое место дом дерева и теряет фокус
клавиатура исчезает, поскольку нет фокуса

Так было?
Вопрос: Исчезает клавиатура при клике на input

Всем доброго времени суток. Возможно не в этот раздел добавляю тему...
Создал сайт, тестирую. Возник трабл есть input в модальном окне.

Если в него поставить курсор на Андройд устройстве то на секунду появляется клавиатура, а затем исчезает.
При этом на apple, windows и любых pc нормально работает.

В какую сторону копать?
Ответ:
Долго играл с кодом, в итоге трабл оказался в верстке.
Если интересно, спрашивайте, расскажу подробно.
Вопрос: Скрипт блока клика input

Здравствуйте, подскажите пожалуйста, как реализовать скрипт блокирования клика по input после того как первый клик был уже выполнен.
Ответ: Можно тупо считать клики:

PHPHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Тест</title>
<style>
body{
text-align:center;
margin:300px auto;
}
[type="button"]{
text-align:center;
cursor:pointer;
width:70px;
}
</style>
<script>
function _(selector){return document.querySelector(selector);}
 
onload=function(){
var k=0,
    max=3;
 
_('#clk').onclick=function(){
return ++k <= max ? alert(k) : false;
}
 
_('#rclk').onclick=function(){k=0;}
 
}
</script>
</head>
<body>
<input type="button" id="clk" value="Clicker" />
<input type="button" id="rclk" value="Reclicker" />
</body>
</html>
Вопрос: Скрыть/показать div по клику input.

Здравствуйте уважаемые. Есть код, три input, по нажатию на один из них показывает свой select.

<div class="conteb conteb-hidden" data-okno="4">
<h4>ВЫБОР ВИДА КАРНИЗОВ:</h4>

<div class="cont-radio">
<div class="button-inline"><input class="button-type-pr" checked="checked" id="k-potol" name="vidkarnizov" type="radio" value="1">
   <label for="k-potol">Потолочные</label></div>
<div class="button-inline"><input class="button-type-pr" id="k-nasten" name="vidkarnizov" type="radio" value="2">
   <label for="k-nasten">Настенные</label></div>
</div>
  
<select class="material-select" id="tkani-sel"><option value="1">Алюминиевые</option><option value="2">Пластик</option> </select> 
<select class="material-select" id="mater-sel" style="display:none"><option selected="selected" value="3">Алюминиевые - 1 ряд</option><option value="4">Алюминиевые - 2 ряда</option><option value="5">Деревянные - 1 ряд</option><option value="6">Деревянные - 2 ряда</option> </select>


var radio_btn_on=$('div.conteb[data-okno=4] input[type="radio"]');
radio_btn_on.click(
		function () {
			$("div.conteb[data-okno=4]").find("select").prop("disabled",true).hide();
			var ch_vib_dis=$(this).val();
			console.log('клик'+ch_vib_dis);
			if (ch_vib_dis==1) {
				$("div.conteb[data-okno=4]").find("select#tkani-sel").prop("disabled",false).show();
			} else{
				$("div.conteb[data-okno=4]").find("select#mater-sel").prop("disabled",false).show();
			};
		});


Замысел такой, вместо select'a скрывать div(3 input на 3 div'a). Как не менял код, что-то не получается, может наведёте на мысль.
Ответ: KEMPZOR,
открывашка 301 - смотреть форум поиск открывашка
Вопрос: Изменение значения в input[text]

День добрый

Есть такой код:
jQuery(function($){
	$(".number-item a").bind("click", function(){
		var This = $(this),
			inputNumber = +This.siblings("input").attr("value"),
			inputNumberClass = This.attr("class");
		if(inputNumberClass == "plus-number-item" && inputNumber >= 0){
			This.siblings("input").attr("value", inputNumber + 1);
			return false
		} else if(inputNumberClass == "minus-number-item" && inputNumber <= 1){
			return false
		} else{
			This.siblings("input").attr("value", inputNumber - 1);
			return false
		}
	});
});


И есть:
<a href="#" class="minus-number-item">-</a>
<input type="text" value="1" />
<a href="#" class="plus-number-item">+</a>


Код работает для value="1", если дергать + и -, но если вбить в input число, то к этому числу + и - не применяться.

Что отвечает за числа напечатанные с клавиатуры в input и как это число изменять, если оно не относится к value?
Ответ:
Сообщение от devote
нужно не .attr("value") использовыать а .val()
Думал про .val(), но не стал проверять, а зря.

Всем спасибо за ответы и оптимизацию решения
Вопрос: всплывающий блок при клике на input

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

<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>


<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 все нормально сварачивается назад но при клике на другое поле инпут или текстера оно не хочет сварачиваться, помогите пожалуйста чайнику
Ответ:
Сообщение от ChikiBOBONI
есть два input и один textarea нужно что бы при клике на поле текст уезжал вверх этих полей
Переведи...
Вопрос: Сделать активным div при активации в нем input

Приветствую, друзья.
Всю жизнь ваял страницы без динамических элементов, но времена меняются - придется учить js.

Дано:
Есть страница с первым уроком курса. А в сайдбаре большой блок с надписью "Урок 2: название_урока". При наведении туда мышкой (hover) на месте блока появляется верхний блок с текстом: "уроки 2-5 можете получить в рассылке" и формой подписки (все это до наведения просто было прозрачным).
Проблема в том, что как только мышку уводишь - снова открывается нижний блок. Так должно быть только если форма неактивна. А если человек начал вводить что-то - форма (и весь верхний блок) уже не должна исчезать.

Подскажите, какие варианты можно применить для таких целей?
Ответ: Примерный набросок того, что нужно.
На месте красного фона будет изображение "Урок 2: бла-бла-бла". При наведении появляется форма, которая не должна исчезать, если в нее что-то вводится.

Пробовал делать через opacity (в примере).
Еще пробовал весь этот блок делать сразу form (без внешнего div), в нее фоном вставлять нужную картинку (вместо красного фона), а внутрь form класть скрытый div с полями ввода и кнопкой.
В обоих случаях ума не хватило.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style  type="text/css">
.main {
  width: 900px;
  margin: 0px auto;
}
.video {
  width: 560px;
  height: 415px;
  background-color: #eeeeee;
}
.subscribe {
  width: 320px;
  height: 415px;
  float: right;
  margin-left: 20px;
  background-color: red;
}
p {
  margin: 0px;
  color: white;
}
form {
  opacity: 0;
  display: block;
  width: 320px;
  height: 415px;
  background-color: #111111;
}
form:hover{
  opacity: 1;
}
.email {
  display: block;
  width: 238px;
  height: 40px;
  padding: 0px 15px;
  margin: 10px auto;
  border:1px solid #aaaaaa;
}
.submit {
  display: block;
  width: 268px;
  height: 43px;
  margin: 10px auto;
  border:1px solid #6c6f8e;
  background-color: #6c6f8e;
  color:#ffffff;
}
</style>
</head>
<body>

<div class="main">
<div class="subscribe">
  <form>
  <p>Здесь текст или список на всю длину блока до формы внизу</p>
    <input type="text" class="email" placeholder="Введите email" />
    <input type="submit" class="submit" value="Подписаться" />
  </form>
</div>  
<div class="video">Здесь видео</div>
</div><!-- .main -->

</body></html>


Если способ не найдется - сделаю на jQuery (палочка выручалочка для таких как я), но подключать всю библиотеку ради одной крошечной функции очень не хочется.
Вопрос: Как сделать поле input доступным для ввода?

У меня есть поле для ввода которое по умолчанию не доступно для ввода букв с клавиатуры. Так же есть элемент <div id='hide_show'> на станице, который скрывается при нажатии на ссылку, и если этот элемент скрыт, то-есть <div id='hide_show'>, мне необходимо разрешить ввод букв с клавиатуры в поле(input).

Вот посмотрите мой код:
<input type="text" class="text" name='input' onfocus="this.blur()">

<a href='javascript:;' onclick="toggle(this);">hide</a>
<div id='hide_show'>
Hellow world
</div>

<script>
        function toggle(a){
            var target = document.getElementById('hide_show');
            target.style.display = target.style.display == 'none' ? "block" : 'none';
            a.innerText = a.innerText == 'hide' ? 'show' : 'hide';
            // я так понимаю что мне нужно что-то здесь сделать
        }
    </script>



Как я могу это сделать?
Ответ:
Сообщение от destus
mikefromru,
<input type="text" class="text" name='input' onfocus="return getStateEnable(this)">

<a href='javascript:;' onclick="toggle(this);">hide</a>
<div id='hide_show'>
Hellow world
</div>
  <script>
  function toggle(a){
            var target = document.getElementById('hide_show');
            target.style.display = target.style.display == 'none' ? "block" : 'none';
            a.innerText = a.innerText == 'hide' ? 'show' : 'hide';
            // я так понимаю что мне нужно что-то здесь сделать
        }
		
	function getStateEnable(ctx){
		var style = document.getElementById('hide_show').style.display;
		return style === 'none' ? true : ctx.blur();
	}
  </script>
Спасибо!
Вопрос: input [type="text"] подскажите решение

Здравствуйте ребята подскажите решение. есть ссылка
<a class="windows-selection-options" data-popup-authen="hr-all" href="javascript: void(0);">Открыть окно</a> которая при клике открывает popup окно, а как сделать что бы при клике на input[type="text"] так же открывалось это popup окно?
Ответ: Spasatel801,
возможно так
<input name="" type="text"  data-popup-authen="hr-all">
Вопрос: Вставить textarea в input

Подскажите, не получается при клике на кнопку вставить данные из textarea в input

Делаю так:


<table>
<tr><td><textarea class="textar" type="text" value="">1</textarea></td></tr>
<tr><td><textarea class="textar" type="text" value="">2</textarea></td></tr>
<tr><td><textarea class="textar" type="text" value="">3</textarea></td></tr>
<tr><td><input type="button" class="textar1" value="GO"></td></tr>
</table>	

<table>
<tr><td><input id="id1" type="text" value=""></td></tr>
<tr><td><input id="id2" type="text" value=""></td></tr>
<tr><td><input id="id3" type="text" value=""></td></tr>
</table>

<script>

$(".textar1").click(function() {
var id1=$( this ).prev(".textar").val();
var id2=$( this ).prev(".textar").prev(".textar").val();
var id3=$( this ).prev(".textar").prev(".textar").prev(".textar").val();

document.getElementById("id1").value=id1;
document.getElementById("id2").value=id2;
document.getElementById("id3").value=id3;

});
</script>


Помогите, что делаю не так?
Ответ:
<table>
  <tr><td><textarea class="textar" type="text" value="">1</textarea></td></tr>
  <tr><td><textarea class="textar" type="text" value="">2</textarea></td></tr>
  <tr><td><textarea class="textar" type="text" value="">3</textarea></td></tr>
  <tr><td><input type="button" class="textar1" value="GO"></td></tr>
</table>	

<table>
  <tr><td><input id="id1" type="text" value=""></td></tr>
  <tr><td><input id="id2" type="text" value=""></td></tr>
  <tr><td><input id="id3" type="text" value=""></td></tr>
</table>

<script src="https://code.jquery.com/jquery-2.1.4.js"></script>

<script>
  $(".textar1").click(function() {
    $(this).closest('table').find('.textar').each(function() {
      $('#id' + $(this).val()).val( $(this).val() );
    });
  });
</script>