ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / JQuery Как добавить элемент рядом с элементом, получившим фокус?
7 сообщений из 7, страница 1 из 1
JQuery Как добавить элемент рядом с элементом, получившим фокус?
    #39479702
waszkiewicz
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
waszkiewicz
Участник
голова что-то кругом идет.
есть таблица со множеством
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
<input type='text' class='tbCli'>
мечтается при получении фокуса добавить справа кнопку подтверждения

однако не выходит каменный цветок

[SRC JS]
$('.tbCli').focus(function() {
            this.after("<button class='btn btn-sm btn-default>' id='btnTdOK'><span class='glyphicon glyphicon-ok'></span></button>");
        })



или и правильно делает, что не выходит? Как подкрутить?
...
Рейтинг: 0 / 0
29.06.2017, 14:35
| Ответить | Цитировать | Написать  
JQuery Как добавить элемент рядом с элементом, получившим фокус?
    #39479723
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
waszkiewiczчто не выходит? Как подкрутить?
Либо начинай тестить свой скрипт... Либо сделай тестовый пример и покажи его тут... На тестовом примере можно что-то показать.
...
Рейтинг: 0 / 0
29.06.2017, 14:58
| Ответить | Цитировать | Написать  
JQuery Как добавить элемент рядом с элементом, получившим фокус?
    #39479840
waszkiewicz
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
waszkiewicz
Участник
пока вопрос в том, как запретить повторный вызов события
https://jsfiddle.net/pincet/va1ru1e9/4/
...
Рейтинг: 0 / 0
29.06.2017, 16:47
| Ответить | Цитировать | Написать  
JQuery Как добавить элемент рядом с элементом, получившим фокус?
    #39479850
waszkiewicz
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
waszkiewicz
Участник
waszkiewicz,
я так понимаю что попал в угол, и каждый раз когда я попытаюсь показать кнопку подтверждения правее input - снова будет событие.
Чего в целом хочется - пользователь выбирает input - появляется кнопка OK рядом с input. Потерял фокус или нажал - пропадает
Как грамотно реализовать?
...
Рейтинг: 0 / 0
29.06.2017, 17:00
| Ответить | Цитировать | Написать  
JQuery Как добавить элемент рядом с элементом, получившим фокус?
    #39479887
Alexander A. Sak
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Alexander A. Sak
Участник
Вариант.
- input и кнопку располагать в одном элементе (div обычно)
- на приход/уход фокуса устанавливать/убирать класс у родительского элемента input-а.
- CSS-ом определить видимость кнопки в зависимости от наличия класса.
...
Рейтинг: 0 / 0
29.06.2017, 17:38
| Ответить | Цитировать | Написать  
JQuery Как добавить элемент рядом с элементом, получившим фокус?
    #39479895
правильные посоны
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
правильные посоны
Гость
Alexander A. SakВариант.
- input и кнопку располагать в одном элементе (div обычно)
- на приход/уход фокуса устанавливать/убирать класс у родительского элемента input-а.
- CSS-ом определить видимость кнопки в зависимости от наличия класса. Александр, щиорт побьери, прав! Так правильней.

А еще правильней не играть в шарады "кликни и увидишь", а сразу показывать кнопку/ссылку. Уж если неймётся, то активировать это хозяйство после валидации (на клиенте) заполнения текстбокса.
...
Рейтинг: 0 / 0
29.06.2017, 17:50
| Ответить | Цитировать | Написать  
JQuery Как добавить элемент рядом с элементом, получившим фокус?
    #39480107
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
waszkiewiczпока вопрос в том, как запретить повторный вызов события
https://jsfiddle.net/pincet/va1ru1e9/4/
Как вариант...

Код: html
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.
38.
39.
40.
41.
42.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='https://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
	$('.tbCli').focus(function() {
		var o=document.createElement('button');
		o.innerHTML='Ok';
		o.addEventListener('click',test);
		this.parentNode.appendChild(o);
	});
	$('.tbCli').blur(test);
	function test(){
		var o=this.parentNode.querySelector('button');
		this.parentNode.removeChild(o);
	};
});
</script>
</head>
<body>
<table>
	<tr>
		<td><input type='text' class='tbCli'></td>
		<td><input type='text' class='tbCli'></td>
		<td><input type='text' class='tbCli'></td>
	</tr>
	<tr>
		<td><input type='text' class='tbCli'></td>
		<td><input type='text' class='tbCli'></td>
		<td><input type='text' class='tbCli'></td>
	</tr>
</table>
</body>
</html>
...
Рейтинг: 0 / 0
30.06.2017, 08:41
| Ответить | Цитировать | Написать  
7 сообщений из 7, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / JQuery Как добавить элемент рядом с элементом, получившим фокус?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
NoSQL.ru       Новости, Чат       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&fpage=37&tid=1444564]:
 0ms
get settings:
 11ms
get forum list:
 12ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 44ms
get topic data:
 10ms
get forum data:
 2ms
get page messages:
 45ms
get tp. blocked users:
 1ms
others: 13ms
total:  144ms
созд. / загр.: 144ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]