Как получить доступ к disabled через css?

Рейтинг: 1Ответов: 2Опубликовано: 18.11.2014

Всем привет.

Есть кнопка

<input type="submit" value="Отправить" name="send_phone" disabled id="add" class="order_button"/>

Через Jquery я проверяю, если все поля активны, то я удаляю diabled, и кнопка становится активной.

Только я вот начал украшать кнопку через css.

order_button{
    background-color:#386cbd;
    border:0px;
    border-radius:2px;
    color:#ffffff;
    padding:5px;
    cursor: pointer;
}

Как получить доступ к disabled через css, чтобы я мог применить свои стили к кнопке, когда она неактивна?

css html jquery
Источник: Stack Overflow на русском

Ответы

▲ 2Принят

http://jsfiddle.net/Lav6juk7/

HTML

<input type="submit" value="Отправить" name="send_phone" />
<input type="submit" value="Отправить" name="send_phone" disabled class="order_button"/>

JavaScript

*{
    padding: 0;
    margin: 0;
}

input[type="submit"]{
    background: #386cbd;
    border: 0px;    
    color: #fff;
    padding: 10px 25px;
    cursor: pointer;
   display: inline-block;
    border-radius: 2px;    
}

.order_button:disabled { 
    background: #f00; 
}
▲ 1

Можно, как ответил @soledar10, а можно кроссбраузерно:

.order-button[disabled="disabled"] {
// ...
}