|
19.07.2012, 09:41
|
Интересующийся
|
|
Регистрация: 09.08.2010
Сообщений: 19
|
|
Выделение содержимого в input
В форме несколько input с заданным текстом по-умолчанию:
<input type="text" name="tel_1" value="+7" />
<input type="text" name="tel_2" value="+7" />
<input type="text" name="tel_3" value="+7" />
Так вот при переключении между ними по клавише tab их содержимое ("+7") автоматически выделяется. Как отменить это выделение? Пробовал по событию focus вернуть false, но выделение срабатывает уже после focus.
|
|
19.07.2012, 10:33
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
Ну на jQuery можно так (В Хроме не пашет
<style type="text/css">
span.Wrap{
display:inline-block;
}
input.Clone{
background-color:#DEF0F2;/**/
position:absolute;
z-index:2;
}
</style>
<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
function Noselect(a) {
$(a).clone().addClass('Clone').prependTo($(a).parent());
}
function ReturnVal(a) {
$(a).parent().find('input.Clone').remove();
}
$('input.Clone').mousedown(function(){
$(this).remove();
})
</script>
<span class=Wrap>
<input type="text" name="tel_1" value="+7" data="" onselect="Noselect(this)" onblur='ReturnVal(this)'/>
</span>
<span class=Wrap>
<input type="text" name="tel_2" value="+7" data="" onselect="Noselect(this)" onblur='ReturnVal(this)'/>
</span>
<span class=Wrap>
<input type="text" name="tel_3" value="+7" data="" onselect="Noselect(this)" onblur='ReturnVal(this)'/>
</span>
Последний раз редактировалось Deff, 19.07.2012 в 21:37.
|
|
19.07.2012, 19:42
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
Как убрать не знаю, но можно сделать чего-нибудь типа этого, чтобы +7 никуда не терялось при первом вводе.
<input type="text" name="tel_1" value="+7"
onkeyup="
if (this.value.length == 0 || this.value.length == 1) this.value = '+7'
">
А чаще +7 ставят перед input-ом, чтобы его вообще не вводили.
Последний раз редактировалось bes, 19.07.2012 в 19:48.
|
|
19.07.2012, 20:05
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
bes,
Ну при таб и получении фокуса - заслонить элементом с тем же контентом, что и в value(я загородил дублем input, убираемого при снятии фокуса , нажатия мыши(нун и нажатие клавиши добавить - забыл
|
|
19.07.2012, 20:15
|
|
Профессор
|
|
Регистрация: 03.05.2011
Сообщений: 848
|
|
Deff, при проходе в обратном направлении (Shift + Tab) приходится 2 раза нажимать данную комбинацию для перехода на предыдущий элемент, т.е. как я понимаю поверх наложенные клоны не удаляются?
|
|
19.07.2012, 21:10
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
Для такого не сильно принципиального момента можно наверное вообще ничего не городить, либо вынести +7 за input, либо сделать разбивку частей номера по input-aм (хотя может быть и есть реальный способ как воздействовать на это выделение)
|
|
19.07.2012, 21:16
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
Сообщение от lord2kim
|
т.е. как я понимаю поверх наложенные клоны не удаляются?
|
Да вродь удаляются (Ток не тестил в обратку, удаляются по любому при потере фокуса)
Ну понятно - при обратном табе фокус переходит на клона... (а на клоне событие не обрабатываю, хотя странно - все одно исходник должен фокус потерять - должно удаляться - тут походу баг - таб как бы фиксируется координатно - вроде как фокус якобы остался и на старом и на новом - Ксать интересный трабл - мон использовать
Последний раз редактировалось Deff, 20.07.2012 в 00:00.
|
|
19.07.2012, 23:58
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
По идее можно управлять положением каретки, но FF и хроме это не прокатывает при получении фокуса по нажатию tab (правда в FF работает корректно, если активировать мышью, а вот в хроме ни так ни этак).
<input id="inp" name="tel_1" value="+7">
<script>
window.onload = function () {
var inp = document.getElementById('inp');
inp.onfocus = function () {
if (inp.createTextRange) {
var r = inp.createTextRange();
r.collapse(false);
r.select();
} else if (inp.setSelectionRange) {
var len = inp.value.length;
inp.setSelectionRange(len, len);
//inp.focus();
}
}
}
</script>
|
|
20.07.2012, 14:18
|
Интересующийся
|
|
Регистрация: 09.08.2010
Сообщений: 19
|
|
За недостатком времени, действительно, пришлось вынести +7 за input. Просто думал, что можно какими-нибудь стандартными средствами отменить выделение (вернуть тот же false, например). В любом случае спасибо за советы.
Последний раз редактировалось Marv, 20.07.2012 в 14:21.
|
|
|
|