E-learn.ro
Panou utilizatori
Utilizator Parola
Creeaza cont nou    Recupereaza parola
Login
Newsletter
Introdu adresa ta de email
Inscrie-te
Inchide panoul de utilizatori
Add to Google
Topul celor mai bine cotate tutoriale
Topul celor mai vizualizate tutoriale
* Cele mai bine clasate si cele mai votate tutoriale sunt selectate dintre tutorialele adaugate in ultimele 30 de zile.

Tutoriale Javascript

Descarca toolbar

Toolbar E-learn.ro Facebook Twitter

WEB DEVELOPMENT  /  Javascript  /  Introducere in Javascript (13)

III. Butoane in JavaScript

13.05.2008
III. Butoane in JavaScript

Folosirea butoanelor in JavaScript.

Total vizualizari: 3011 3011 afisari   |   Comentarii  0   |   Rating   |   (0 voturi)   |   Timp necesar: 10 min 10 min   |   Nivel de cunostiinte necesar: Incepator  Incepator

Sursa:  E-learn.ro  
Autor:  E-learn.ro
Adauga la tutoriale favorit Adauga la tutoriale favorite
Pagina:
1
comenteaza printeaza

Pentru a folosi butoanele in scripturi, trebuie ca acestea sa fie mai intai incluse in pagina printr-un formular HTML. Tag-ul <input> prin care este introdus butonul este continut de tag-ul <FORM>:

<FORM> 
    <INPUT type="button" value="Textul butonului" name="buton1"> 
</FORM>

Acest cod HTML va plasa un buton pe pagina, dar acesta nu va avea nici un efect, daca il apasati nu se va intampla nimic. Sa analizam comanda javascript care transmite browserului cum sa actioneze daca utilizatorul apasa butonul. Plasati acest cod in tag-ul INPUT in care ati creat butonul:

 
  <INPUT type="button" value="Textul butonului" name="buton1" onClick=" ">

Daca ati citit capitolul anterior, atunci stiti cum puteti adauga text in status bar folosind comanda onMouseover. Acest lucru este valabil si pentru butoane:

 
<FORM> 
    <INPUT type="buton" value="Text" name="buton2" 
    onClick="window.status='Ati apasat butonul 1'; return true">
</FORM>

Daca testati acest cod, veti vedea ca in status bar a aparut textul „Ati apasat butonul 1”. De asemenea, puteti permite utilizatorilor sa schimbe culoarea fondului paginii. In loc de window.status folositi comanda: document.bgColor='culoare'. Introduceti aceasta linie ca instructiune pentru comanda onClick, in modul urmator:

 
<FORM> 
    <INPUT type="button" value="Schimba culoarea in verde!" 
    name="buton3" onClick="document.bgColor='green'">
</FORM>

Puteti adauga oricate butoane de acest gen doriti, dar asigurati-va ca ati inclus si un buton pentru a reveni la culoarea initiala. Scripul urmator va ofera trei optiuni pentru culoarea fondului: verde, albastru sau culoarea originala.

 
<FORM> 
    <INPUT type="button" value=" Schimba culoarea in verde!" 
    name="buton3" onClick="document.bgColor='yellow'"> <br> 
    <INPUT type="button" value=" Schimba culoarea in albastru!" 
    name="buton4" onClick="document.bgColor='blue'"> <br> 
    <INPUT type="button" value="Revenire" name="buton5" 
    onClick="document.bgColor='white'"> 
</FORM>

Ultimul script din acest capitol va va arata cum puteti folosi butoanele ca linkuri. Pentru aceasta, folositi comanda: window.location=’url’. De exemplu, iata un script care redirectioneaza utilizatorul catre o pagina oarecare:

  
<FORM> 
    <INPUT type="button" value="Alta pagina" name="buton6" 
    onClick="window.location='http://www.site.com/pagina.htm'"> 
</FORM>
Pagina:
1
comenteaza printeaza
Alte tutoriale Javascript:
Noteaza acest tutorial
Rating tutorial
 
(0 voturi)
Pentru a nota acest tutorial, trebuie sa fii logat!
Posteaza un comentariu
Pentru a posta un comentariu, trebuie sa fii logat!
0 TOP UTILIZATORI* 0 0
Tutoriale scrise de kheops
kheops Rang utilizator kheops - Mediu
3027
Tutoriale scrise de adry.ro
adry.ro Rang utilizator adry.ro - Incepator
794
Tutoriale scrise de Pustiu
Pustiu Rang utilizator Pustiu - Expert
625
Tutoriale scrise de tornaddoss
tornaddoss Rang utilizator tornaddoss - Incepator
589
Tutoriale scrise de angel140581
angel140581 Rang utilizator angel140581 - Incepator
335
* Acest top reprezinta punctajele acumulate in ultimele 30 de zile.
Produse evoMAG.ro
Elefant.ro - Premium
Word Swift 3D Javascript MySQL RoR JSON Gimp SEO Fireworks COREL DRAW Vista Dreamweaver Outlook PSD AJAX XML Python Powerpoint CSS Verilog Action Script XHTML Illustrator PHP Excel Lightroom SWF Bridge Photoshop Java Sony Vegas Flash StyleSheet Ruby on Rails Fotografie HTML
Promovare:
Daca faci parte din comunitatea E-learn.ro si doresti promovarea acesteia, poti accesa pagina de promovare.
Arhiva newsletter:
Daca ai ratat un numar mai vechi, sau vrei sa revezi care au fost noutatile E-learn.ro la un moment dat, poti accesa arhiva de newslettere.
  Copyright © 2008-2012 E-LEARN.ro. Toate drepturile rezervate. Termeni si conditii.
Conceput si realizat de Neokinetics Software
Submit Your Site SmartNetBook.ro