thuis / internet / web Development / Hoe code in te voegen op de knop

Hoe kan ik de knop code in te voegen

/
42 Bekeken

Hoe kan ik de knop code in te voegen</a>

Knop in de webpagina's gebruikt om interactieve communicatie te organiseren met de gebruiker.

In de regel, als de reactie op een druk op de knop niet nodig verzenden van gegevens naar de server, de interactiviteit is geïmplementeerd met behulp van JavaScript-scenario's.

Werkwijzen roep het overeenkomstige JavaScript-code kan variëren - het volgende wordt een aantal mogelijke uitvoeringsvormen voor verschillende soorten knoppen.

instructie

    1

Als de display-knop op de webpaginageorganiseerd door een knop tag, kan de JavaScript-code in de onclick attribuut worden geplaatst. Bijvoorbeeld, zoals: & lt-knop onclick = »alert ( '! Knop wordt ingedrukt) -« & gt-knop & LT-knop / & gt-cursus, direct in de knop tag geplaatst is groot genoeg code is niet gepast - is het beter om het te ontwerpen als een functie, en in het onclick attribuut alleen zet de code oproepen van deze functie. Bijvoorbeeld: & lt-script & GT
showAlert functie () {
alert ( 'knop wordt gedrukt!')
}
& LT / script & GT & lt-knop onclick = »showAlert ()» & gt-knop & LT / knop & GT

    2

Als de knop wordt weergegeven door een van deingang tag opties (in te dienen, reset, knop of afbeelding), kunt u hetzelfde kenmerk onclick gebruiken. Bijvoorbeeld, voor het gebied van clearing knop formulier (reset), kan de code er als volgt uitzien: & lt-input type = »RESET» onclick = »showAlert ()» / & gt-Wilt u voor slechts JavaScript-script te drukken op de actieknop, en haar toegewezen de standaard actie niet gebeurt, dan is de functie of direct in het onclick attribuut moet toevoegen return false commando. Bijvoorbeeld: & lt-input type = »RESET» onclick = »showAlert () - RETURN FALSE» / & GT

    3

Als het nodig is om een ​​antwoord op de druk op de knop te organiserentyp opgeeft, waarna naast de bovenstaande werkwijze met de onclick attribuut eigenschappen kunnen worden gebruikt form tag, waaraan deze toets. De overeenkomstige functieaanroep kan de vorm onsubmit kenmerktag worden geplaatst. Bijvoorbeeld: & lt-form action = »» onsubmit = »showAlert () - return false» & GT
& Lt-input type = »submit» / & GT
& LT / form & GT

    4

Als de knop is geen onderdeel van het formulier, en aleen grafisch element (tag img) en vervolgens voor hem standaarden maken het gebruik onclick attribuut. Bijvoorbeeld: & lt-img src = »btn.gif» onclick = »showAlert () -» / & GT

    5

Als de knop is een hyperlink, degebruik maken van de eigenschappen van de knop zelf is niet noodzakelijk, is het beter om te profiteren van de eigenschappen van de tag gevonden. Het is mogelijk, zoals in de voorgaande uitvoeringsvormen gebruiken onclick tag. Bijvoorbeeld: & lt-a href = »http://learn-myself.com» onclick = »showAlert () - return false -«& GT & lt-img src =»btn.gif» / & GT & LT / a & gt-A kan worden vervangen door een functie oproep aan het adres in het href attribuut. Bijvoorbeeld omdat: & lt-a href = »javascript: showAlert () -«& GT & lt-img src =»btn.gif» / & GT & LT / a & GT

Hoe kan ik de knop code in te voegen Het is voor het laatst gewijzigd: 20 juni 2017 door nolseowb
Het belangrijkste binnenhouder voettekst