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&tid=1444564]:
 0ms
get settings:
 10ms
get forum list:
 13ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 74ms
get topic data:
 12ms
get forum data:
 3ms
get page messages:
 47ms
get tp. blocked users:
 2ms
others: 12ms
total:  181ms
созд. / загр.: 181ms
x
x
Закрыть


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