Rádiógombok beállítása és érvényesítése

A. Telepítése és érvényesítése választógombok úgy tűnik, hogy a űrlapmező ami sok webmester számára a legnagyobb nehézséget okozza a beállítások során. Valójában ezeknek a mezőknek a beállítása a legegyszerűbb az űrlapmezők közül, hogy rádiógombokként érvényesítsék azokat az értékeket, amelyeket csak az űrlap benyújtásakor kell tesztelni.

A választógombok nehézsége az, hogy van legalább két és általában több mező, amelyeket el kell helyezni az űrlapra, össze kell kapcsolni és egy csoportnak kell tesztelni. Feltéve, hogy a gombok helyes elnevezési konvencióit és elrendezését használja, akkor nem lesz gondja.

Az első dolog, amelyet az űrlapon lévő rádiógombok használatakor érdemes megnézni, hogyan kell kódolni a gombokat annak érdekében, hogy rádiógombokként megfelelően működjenek. A kívánt viselkedés, hogy egyszerre csak egy gombot válasszunk; Ha egy gombot választunk ki, akkor az összes korábban kiválasztott gomb automatikusan megszűnik.

A megoldás itt az, ha a csoporton belüli összes választógombnak ugyanazt a nevét, de eltérő értékeket adjuk meg. Itt van a kód, amelyet maguk a választógombokhoz használnak.

A választógombok több csoportjának létrehozása az egyik forma számára szintén egyszerű. Csak annyit kell tennie, hogy a rádiógombok második csoportját más névvel adja meg, mint az első csoportban.

A név mező határozza meg, hogy mely csoporthoz tartozik egy adott gomb. Az az érték, amelyet egy űrlap benyújtásakor átadnak egy adott csoportnak, a csoporton belüli gomb értéke, amelyet az űrlap benyújtásakor választottak ki.

Annak érdekében, hogy az űrlapot kitöltő személy megértse, mi a csoportunk minden egyes választógombja, minden egyes gombhoz leírást kell adnunk. Ennek legegyszerűbb módja az, ha egy leírást szövegként ad meg közvetlenül a gomb után.

Van néhány probléma az egyszerű szöveg használatával:

1. Lehet, hogy a szöveg vizuálisan társítva van a választógombbal, de például a képernyőolvasókat használók számára ez nem egyértelmű.
2. A legtöbben felhasználói felületek rádiógombok segítségével a gombhoz társított szöveg kattintható és kiválaszthatja a hozzá tartozó rádiógombot. Ebben az esetben a szöveg csak akkor működik így, ha a szöveget kifejezetten a gombhoz társítják.

Ahhoz, hogy a szöveget hozzákapcsoljuk a megfelelő választógombhoz, hogy a szövegre kattintva kiválasztjuk azt a gombot, meg kell tennünk készítsen további kiegészítést az egyes gombok kódjaihoz azáltal, hogy a teljes gombot és a hozzá tartozó szöveget körülveszi a címke.

Így néz ki az egyik gomb teljes HTML-je:

 egy gombot

Rádiógombként a mert paraméterét a címke magában foglalja magában a címkében, a mert és id paraméterek redundánsok egyes böngészőkben. Böngészőik azonban gyakran nem elég okosak ahhoz, hogy felismerjék a fészkelést, ezért érdemes betenni őket, hogy maximalizáljuk a böngészők számát, amelyben a kód működni fog.

Ez befejezi a rádiógombok kódolását. Az utolsó lépés a rádiógomb érvényesítésének beállítása a JavaScript.

Lehet, hogy a választógombok csoportjainak érvényesítése nem nyilvánvaló, de egyszerû, ha tudod, hogyan.

A következő funkció ellenőrzi, hogy a csoport egyik választógombja ki van-e választva:

// Rádiógomb érvényesítés
// szerzői jog Stephen Chapman, 2004. november 15., 2005. szeptember 14
// Ön másolhatja ezt a funkciót, de kérjük, vegye figyelembe a szerzői jogi figyelmeztetést
funkció valButton (btn) {
var cnt = -1;
for (var i = btn.hossz-1; i> -1; i--) {
if (btn [i]. ellenőrzött) {cnt = i; i = -1;}
}
if (cnt> -1) visszaadja a btn [cnt] .értéket;
egyébként semleges;
}

A fenti funkció használatához hívja meg az űrlap-érvényesítési rutinból, és adja meg a rádiógomb csoport nevét. Visszaadja a gomb értékét a kiválasztott csoporton belül, vagy nulla értéket ad vissza, ha a csoportban egyik gombot sem választja ki.

Például, itt van a kód, amely végrehajtja a rádiógomb érvényesítését:

var btn = valButton (forma.csoport 1.);
if (btn == null) riasztás ('Nem választottunk választógombot');
Egyéb figyelmeztetés ('Gombérték' + btn + 'kiválasztva');

Ezt a kódot beépítették az an hívott funkcióba kattintásra az űrlapon található érvényesítés (vagy benyújtás) gombhoz csatolt esemény.

A teljes űrlapra való hivatkozást paraméterként adták át a függvényhez, amely a "űrlap" argumentumot használja a teljes űrlap hivatkozására. Ezért a rádiógomb-csoportnak az1-es csoportnév érvényesítéséhez ezért át kell adnunk a form.group1-et az valButton függvénynek.

Az összes választógomb-csoport, amelyre bármikor szüksége lehet, a fent leírt lépésekkel kezelhető.