2016-05-20 5 views
-2

Я хочу скрыть местозахват на клик, но кажется что-то блокирующим фокус, я пытаюсь добавить css input:focus:placeholder ETC. Но ничего, это весь мой код, попробуйте, если есть что-то в js, что предотвратит фокусировку.Фокус на клик не работает

jsfiddle.net/74fnr3k7/

+0

заполнители исчезают, как только пользователь начинает печатать. – Cruiser

ответ

0

Вы помечено этот вопрос с JQuery , но вы не включили свою скрипку, поэтому я не уверен, что вы ее используете. Если вы, добавьте эти строки в JS, и это будет удалить заполнитель в центре внимания:

$('input').on('focus',function(){ 
    $(this).attr('placeholder',""); 
}); 

Убедитесь, что вы обернуть его в document.ready функции ($ (функция() ... в JQuery). Вот скрипка:

http://jsfiddle.net/4tt77a65/

+0

Да, это работает, можете ли вы добавить код, что на размытии появляется снова? –

+0

просто замените «фокус» на «размытие» и поместите новый текст в двойные кавычки функции attr(). ... .on ('blur', function() {... .attr ('placeholder', 'new placeholder text'); ... – Cruiser

0

Чтобы скрыть заполнитель на фокусе поля ввода можно использовать onfocus и onblur события.

Ниже для примера:

<input type="text" placeholder="placeholder" onfocus="this.placeholder = ''" onblur="this.placeholder = 'placeholder'"/>

+0

ничего, заполнитель еще здесь, просто исчезает, когда я начинаю печатать. –

+0

См. Мой обновленный ответ ... –

0

Добавить это:

textarea:focus, input:focus 
 
{ 
 
    outline: none; 
 
}
<div class="form-group"> 
 
    <input type="text" id="exampleInlineTags" class="form-control token-example-field" name="search" value="" placeholder="placeholder" /> 
 
    <button type="submit" class="btn btn-primary pull-right pretraga " id="sonata_search_submit"> 
 
    <i class="glyphicon glyphicon-search"></i> 
 
    <span>SEARCH</span> 
 
    </button> 
 
</div>

+0

ничего, заполнитель еще здесь, просто исчезает, когда я начинаю печатать. –

+0

Просто добавьте свой JS. Здесь есть только CSS и HTML. ** Демо [JSFddle] (http://jsfiddle.net/74fnr3k7/1/) ** – Pierrou

+0

Пожалуйста, перечитайте вопрос, Pierrou; это заполнитель, на который он хочет избавиться, а не план. – Shaggy

1

атрибут placeholder="" обычно исчезает, когда пользователь начинает вводить Если вы хотите, чтобы скрыть текст до того, как пользователь начинает вводить, вы можете использовать проект placeholder pseudo-element

вы ки.. n скрыть текст, изменив цвет текста заполнителя.

/* Chrome/Safari/Opera */ 
input[type="text"]:focus::-webkit-input-placeholder { 
    color: transparent; 
} 

/* Firefox */ 
input[type="text"]:focus::-moz-placeholder { 
    color: transparent; 
} 

/* Internet Explorer */ 
input[type="text"]:focus:-ms-input-placeholder { 
    color: transparent; 
} 

/* Edge */ 
input[type="text"]:focus::-ms-input-placeholder { 
    color: transparent; 
} 

Как @Shaggy указывал, я не включил ::placeholder без каких-либо конкретного браузера префиксов:

input[type="text"]:focus::placeholder { 
    color: transparent; 
} 

На данном этапе, я не в курсе, какие (если таковые имеются) броузеров поддерживайте это без префикса браузера. В Can I Use указано, что для каждого браузера требуется префикс, потому что этот псевдоселектор draft status на данный момент. Однако добавление селектора без префиксов в будущем подтвердит ваш код, если/когда он станет стандартным псевдоселектором.

Есть другие варианты, которые будут использовать JavaScript для изменения значения placeholder="" для onBlur() и onFocus() событий.

+1

Не забывайте о неподписанном элементе ':: placeholder'. – Shaggy

Смежные вопросы