W JavaScript często napotykamy strony internetowe lub formularze posiadające określone wymagania dotyczące wypełnienia formularza. Na przykład konieczne jest wypełnienie określonego pola wejściowego określoną liczbą znaków. W takich przypadkach funkcjonalność wyłączenia przycisku w JavaScript na podstawie warunku jest bardzo przydatna, aby zapewnić poprawność i przepisy danych dotyczących określonego danych elementu.

Ten blog będzie kierował warunkowo przyciskiem w JavaScript.

Jak wyłączyć przycisk w JavaScript w oparciu o warunek?

Aby wyłączyć przycisk w JavaScript w oparciu o warunek, można zastosować następujące podejścia:

• "wyłączony„Nieruchomość z„długość" nieruchomość
• "Obejmuje ()" I "dokument.getElementById ()”Metody

Przejrzyj omawiane metody jeden po drugim!

Metoda 1: Wyłącz przycisk w JavaScript w oparciu o warunek za pomocą właściwości „Wyłączone” i „Długość”

„„wyłączony„Właściwość wskazuje, czy kontrola jest wyłączona, a jeśli tak, nie akceptuje kliknięć i„długość„Właściwość określa długość ciągu. Te właściwości zostaną wykorzystane do wyłączenia przycisku na warunkach. Na przykład w polu wejściowym wprowadzono określoną długość znaków.

Przegląd poniższy przykład, aby zrozumieć określoną koncepcję.

Przykład

Po pierwsze, dołącz typ wejściowy o nazwie „tekst”I wartość zastępcza. Następnie dodaj przycisk nagłówek w utworzonej div:

Pokazywać

Wyłącz przycisk

Przejdź do pliku JavaScript i pobieraj określone elementy za pomocą „dokument.QuerySelelect ()" metoda:

Niech przycisk = dokument.querySelelect („przycisk”);
Let Input = Dokument.querySelelect („wejście”);
Niech wyjście = dokument.QuerySelelect („H1”);

Następnie dołącz słuchacz wydarzeń o imieniu „Kliknij”I dołącz go do określonego przycisku, który wypełni wartość pola wejściowego po kliknięciu przycisku:

przycisk.addEventListener („kliknij”, () =>
wyjście.innerText = wejście.wartość;
);

Podobnie wydarzenie o nazwie „Keyup”Zostanie dołączone do pola wejściowego, które uruchomią podaną funkcję w taki sposób, że jeśli długość wartości pola wejściowego stanie się większa niż„5”, Przycisk zostanie wyłączony:

wejście.addEventListener ('keyUp', () =>
if (wejście.wartość.długość> 5)
przycisk.niepełnosprawne = true

w przeciwnym razie
przycisk.niepełnosprawny = false;

);

Wyjście

Metoda 2: Wyłącz przycisk w JavaScript na podstawie konkretnego warunku za pomocą „Obejmuje ()” i dokumentuj.GetElementById () Metody

„„getElementById ()„Metoda uzyskuje dostęp do elementu o określonej wartości w jego argumencie i„Obejmuje ()”Metoda zwraca true, jeśli określony ciąg zawiera określoną wartość ciągu. Metody te można zastosować w celu pobrania identyfikatora wejściowego i umieszczenia warunku na określonym znaku w polu wejściowym.

Składnia

dokument.getElementById (elementId)

Tutaj, "ElementId”Odnosi się do konkretnego identyfikatora elementu HTML.

Obejmuje (wyszukiwanie wartości)

W powyższej składni „Wartość wyszukiwania”Odnosi się do wartości, którą należy przeszukać.

Poniższy przykład pokazuje podaną koncepcję.

Przykład

Po pierwsze, dołącz typ wejściowy o nazwie „tekst”I„Onkeyup„Wydarzenie dostępu do funkcji o nazwie„DisableButton (to)" Gdzie "Ten”W jego argumencie odnosi się do obiektu:

Podobnie dołącz typ wejściowy o nazwie „składać”Z wartością niepełnosprawną w następujący sposób:

Teraz zadeklaruj funkcję o nazwie „DisableButton (TXT)" Gdzie "tekst”Odnosi się do obiektu. Pobierz element typu wejściowego za pomocą dokumentu.metoda getelementById (). Na koniec zastosuj warunek wyłączania przycisku, określając konkretny znak „!" używając "Obejmuje ()" metoda. Będzie to działać w taki sposób, że jeśli określony znak zostanie wykryty w polu wejściowym, przycisk zostanie wyłączony:

FunkctionDisableButton (txt)
var bt = dokument.getElementById („prześlij”);
if (wyłącz.wartość.Obejmuje ('!'))
Bt.niepełnosprawne = true

else bt.niepełnosprawny = false;

Wyjście

Zaproponowaliśmy najprostsze metody wyłączania przycisku w JavaScript.

Wniosek

Aby wyłączyć przycisk w JavaScript w oparciu o warunek, skorzystaj z „wyłączony„Nieruchomość z„długość„Własność, która zastosuje funkcjonalność na podstawie długości znaków wejściowych lub„Obejmuje ()„Metoda z„dokument.getElementById ()”Metoda dostępu do pola wejściowego i zastosowania warunku na określonym znaku w polu wejściowym. Niniejszy podręcznik dostarczył procedurę w celu wyłączenia przycisku w JavaScript na podstawie dodanego warunku.