A navigáció legördülő listája

A legördülő menü formája az alábbiak szerint kódolható:

Az opcióelem a legördülő listában szereplő értékeket tartalmazza.

Néha szükség lehet rá, hogy ez a legördülő menü szerepeljen a navigációs menüben. Ez azt jelenti, hogy ha egy adott lehetőséget választunk, akkor a megfelelő oldalra lépnénk. Természetesen ez a fajta navigáció nem lehet alapvető, de bizonyos esetekben kiegészítő jellegű is lehet a navigáció.

Így folytatjuk a kódolást. A legtöbb programozási feladathoz hasonlóan ez a feladat különbözőképpen megoldható. Vegyük az egyiket. Először minden egyes legördülő menü értékét állítjuk be, ez az érték a megfelelő oldal URI-ja, amelyre az átmenetre kerül sor, ha ezt az opciót választotta.

Jobb, ha egy gombra kattintunk, amikor rákattintunk az átmenetre. Más szóval az átmenet nem lesz automatikus. A felhasználó kiválasztja a kívánt elemet a legördülő menüben, majd megnyomja a gombot, és átmenet történik. Ehhez az onclick eseményt (ha megnyomjuk) a bemeneti elemhez történő rögzítéssel fogjuk használni.

űrlapok [0] - az űrlap sorszáma. Ő az első. Számozás a semmiből. Ha ez nem az első (ha több formában van az oldalon), módosítania kell. Talán jobb, ha ID-hozzáférést használ a document.getElementById [value id]

document.forms [0] .mymenu.options [document.forms [0] .mymenu.selectedIndex] .value - mindaddig, amíg az érték első hozzáférést egy tömböt (gyűjtemény) lehetőségeket, majd a kiválasztott elemet a legördülő listából keresztül selectedIndex , majd az érték tulajdonsághoz

Ne aggódj idézőjelekkel, kérlek. document.forms [0] .mymenu.options [document.forms [0] .mymenu.selectedIndex] .value visszatér egy sorban, nem kell elhelyezni egyszeres idézőjelbe.

Íme, amit kaptunk:

Ha a lista túl nagy, az ablak méretét a kiválasztott címke kiválasztási attribútumára korlátozhatja, mely esetben ha a lista meghaladja az ablak magasságát, megjelenik a görgetősáv. A Google Chrome-ban a megadott listaméreteket figyelmen kívül hagyja. Listacím görgetősávval és gombokkal:

Az ablak szélessége és magassága stílusban is megadható: "width: 200px; height: 60px;" A kijelölt címke (alapértelmezés szerint a szélesség a listában szereplő leghosszabb szóval van igazítva), a Google Chrome megérti ezt az ablakméretet:

Új URL megnyitása

A kiválasztott url új ablakban való megnyitásához használja az ablak.open metódust:

Az ablak funkcióját és méretét szabályozhatja, például:

Ha szükséges, a gomb a fentiek szerint kerül beillesztésre.

Kapcsolódó cikkek