Моделирование фокуса Bootstrap CSS

Question

У меня есть несколько входов в форме, и я хотел бы использовать синюю подсветку Bootstrap для текстовых полей, которые в настоящее время не находятся в фокусе, используя JQuery.

Answer 1

Bootstrap в: стиль фокус:

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus { 
border-color: rgba(82, 168, 236, 0.8); 
outline: 0; 
outline: thin dotted \9; 
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6); 
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6); 
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6); 
} 

Вы можете скопировать стиль в класс CSS:

.focus { 
    border-color: rgba(82, 168, 236, 0.8); 
    outline: 0; 
    outline: thin dotted \9; 
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6); 
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6); 
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6); 
} 

затем просто добавить focus к Classname Вашего входного поля в

некрасиво, но работает

Answer 2

Я не уверен, насколько правильно понимаю ваш вопрос LY, но если вы хотите применить входное свечение Jquery к сфокусировано текстовому полю, то вы можете просто использовать CSS:

input:not(:focus){ 
    border-color: rgba(82, 168, 236, 0.8); 
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(82, 168, 236, 0.6); 
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6); 
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);` 
    outline: 0 none; 
} 

Вы можете добавить больше выбора, как: нет ([= кнопка типа]): нет ([тип = submit]) ect.

Answer 3

С ботстрапом меньше, примените смесь .tab-focus(), чтобы добавить фокус.