Vă mulțumim pentru susținere

Cum pot să fac un buton de comutare de la clic pe eticheta de text, de asemenea?

Checkboxes in HTML forms don't have implicit labels with them. Adding an explicit label (some text) next to it doesn't toggle the checkbox.

Cum fac o casetă de selectare să treacă de la clic pe eticheta de text, de asemenea?

0
adăugat editat
Puteți edita întrebarea inițială? În prezent, răspunsul cel mai bine evaluat este cel mai bun pentru întrebare, așa cum este formulat. Răspunsul acceptat răspunde, de fapt, la o actualizare la întrebare și am modificat corespunzător (va inversa după editare).
adăugat autor Bobby Jack

8 răspunsuri

Setați proprietatea display a CSS pentru ca eticheta să fie un element de bloc și să utilizați această funcție în loc de div - păstrați semnificația semantică a unei etichete, permițând în același timp orice stil să vă placă.

De exemplu:

label {
  width: 100px;
  height: 100px;
  display: block;
  background-color: #e0e0ff;
}
0
adăugat
Este mai bine să bifați caseta de selectare în afara etichetei.
adăugat autor MrFox
@MrFox Când se utilizează afișarea: blocați caseta de selectare trebuie să fie în interiorul etichetei jsfiddle.net/Flandre/sBCLv/ 1
adăugat autor Andre

Îți poți împacheta caseta de selectare în etichetă:


0
adăugat

Înfășurarea cu eticheta încă nu permite să faceți clic pe "nicăieri în cutie" - totuși doar pe text! Asta face treaba pentru mine:

Date of birth entry must be completed

dar, din păcate, are o mulțime de javascript care se schimbă efectiv de două ori.

0
adăugat

Dacă marcați corect codul HTML, nu este nevoie de javascript. Următorul cod va permite utilizatorului să facă clic pe textul etichetei pentru a bifa caseta de selectare.



Atributul pentru de pe elementul de etichetă face trimitere la atributul id din elementul de intrare, iar browserul face restul.

Acest lucru a fost de testare pentru a lucra în:

  • IE6
  • IE7
  • Firefox
0
adăugat
Nu este util dacă creați mai multe rânduri care au toate casetele de selectare, deoarece ar trebui să le dați fiecărui nume și id identic cu cele indicate aici.
adăugat autor AndroidDev

Ronnie,

Dacă doriți să includeți textul etichetei și caseta de selectare în interiorul unui element de înfășurare, puteți face următoarele:


0
adăugat

acest lucru ar trebui să funcționeze:




checkbox

dacă nu, pleae corect!

0
adăugat
Îmbunătățire: box.checked =! Check; . Evită repetarea, deși lizibilitatea este puțin compromisă.
adăugat autor Rafael Campos Nunes

As indicated by @Gatekiller and others, the correct solution is the

0
adăugat

Trebuie doar să înfășurați caseta de selectare în eticheta de etichetă exact așa

 

FIDDLE

sau puteți utiliza, de asemenea, atributul pentru al etichetei și id de la caseta de selectare mai jos



FIDDLE

0
adăugat