Wyłączyć pole tekstowe bez zmiany stylu?

Jak można wyłączyć pole tekstowe HTML bez konieczności zmiany wyglądu pola tekstowego przeglądarki?Wyłączyć pole tekstowe bez zmiany stylu?

Mamy wyłączyć z JQuery: $(".datepick").attr('readonly', 'readonly');

działa dobrze, ale w Firefox pojawi się pole tekstowe z szarym tłem i grubą ramką. Chcemy temu zapobiec.

Powodem, dla którego to robimy, jest zaznaczenie pola tekstowego wyboru daty w języku JQuery (aby użytkownik musiał korzystać z obszaru podręcznego kalendarza).

Źródło

2010-11-11 Marcus Leon

Kiedy używam tylko readonly w Firefoksie (3.6.12), to nie daje mi szarego tła ani innej granicy. –

Hmm .. Jesteśmy na 3.6.10 –

Nie dostaję też różnych stylów.Nie mogę rozwiązać części DatePicker, ale tutaj jest trochę CSS, aby nadpisać styl "disabled": input [disabled] { background-color: #FFF; border-color: # 404040; szerokość obramowania: 2px 1px 1px 2px; } (w oparciu o domyślne style Firefox) – attack

Można to zrobić poprzez rozmycie wprowadzania tekstu na focus:

$('.datepick').focus(function(){ 
    this.blur(); 
});

Alternatywnie, można po prostu wyłączyć w polu tekstowym na wejściu:

$('.datepick').keydown(function(e){ 
    e.preventDefault(); 
});

Źródło

2010-11-11 20:40:44 lonesomeday

Próbowałem 'e.preventDefault();' .. działało, ale zauważyłem, że w Chrome klucz do usunięcia nadal działał. Nie mogłem wprowadzić tekstu, ale mogłem go usunąć po wybraniu daty za pomocą kontrolki - nie tego, co chciałbym .. –

@Marcus Zmieniłem moje pytanie sugerując użycie 'keydown' zamiast' keypress'. Wolę jednak pierwszą technikę. – lonesomeday

Pierwsze rozwiązanie (rozmycie) nie działa w przeglądarce Chrome. Drugie rozwiązanie wygląda dobrze! –

-1

hows o attr('disabled', true). aby ponownie włączyć, removeAttr('disabled')

http://jsfiddle.net/E9m3K/3/

^stylizowany wyłączona, ponieważ poproszony o wyłączyć

http://jsfiddle.net/E9m3K/4/

^stylizowany tylko do odczytu, więc prawdopodobnie po prostu chcesz nadpisać/jednoznacznie określić border i background w css.

Źródło

2010-11-11 20:21:59

To nadal powoduje, że tło jest szare. ORAZ zatrzymuje działanie terminala danych JQuery. –

Po prostu umieść styl w tle? To samo dotyczy granicy ... –

Jakie style zmieniają się po ustawieniu opcji readonly/disabled = true? –

Atrybut disabled elementu input zapobiega ogniskowaniu i wprowadzaniu bez zmiany wyglądu.

Źródło

2010-11-11 20:30:22 BenV

Nie działa dla mnie. Zobacz moje komentarze na odpowiedź @ medera. –

Wyłączony atrybut zapobiega także publikowaniu wartości w polu. – Vic

Jeśli chcesz nadpisać stylizacji dla wyłączone pole wprowadzania, jawnie ustaw styl dla wejściowego pola tekstowego, tak:

input[type=text] { 
    color: #000; 
    background-color: #fff; 
} 
/* alternatively you could add textarea to this as well */

dodatkowo można ustawić klasę css jak „wyłączone”, gdy ustawisz wejście osobom niepełnosprawnym i używać niepełnosprawnej styl css tak:

input[type=text].disabled { 
    /* disabled styling goes here */ 
}

a następnie niektóre kodu tak:

$(some_input).attr('disabled', 'disabled'); 
$(some_input).addClass('disabled');

i ponownie włączyć pole możesz spróbować coś takiego:

$(some_input).removeAttr('disabled'); 
$(some_input).removeClass('disabled');

Źródło

2013-04-02 08:09:48 DJTripleThreat

Spróbuj:

$(".ui-state-disabled").removeClass("ui-state-disabled");

Pracowałem z elementami, które można przeciągać i upuszczać, i chciałem wyłączyć tę funkcję bez zmiany ich wyglądu.

Źródło

2013-11-29 14:39:51 GameThinks

Wyłączyć pole tekstowe bez zmiany stylu?

Odpowiedz

Powiązane problemy