Dator
 |  Startsida |  Hårdvara |  Nätverk |  Programmering |  Programvara |  Felsökning |  System |   
Programmering
  • C /C + + -programmering
  • Computer Programspråk
  • Delphi Programmering
  • Java Programming
  • JavaScript programmering
  • PHP /MySQL Programmering
  • perl Programmering
  • python Programming
  • Ruby programmering
  • Visual Basics Programmering
  • * Dator Kunskap >> Programmering >> JavaScript programmering >> Content

    Hur Ring JavaScript Från en HTML-mall

    En HTML- mall är typiskt en eller flera HTML-dokument som ger en ram för en webbplats , men som inte innehåller något innehåll . En användare kan köpa en HTML- mall för att skapa en webbplats snabbt genom att ange hennes företagsuppgifter och slutföra andra tomma avsnitt i mallen med information specifik för hennes företag . Du kan ringa JavaScript från en HTML- mall på samma sätt som du skulle ringa det från någon HTML-fil . Instruktioner
    1

    Skapa en HTML- mall som innehåller ett kontaktformulär och ringa JavaScript från mallen för att validera att användaren inmatade informationen i kontaktformuläret . Skapa en ny HTML- fil med Anteckningar eller en HTML-editor och skriv in HTML header information i filen : < ! DOCTYPE HTML >




    HTML-mall < /title > <br> 2 <p> Skapa lite styling till felmeddelandet du kommer att visas om ingen information har ingått ett fält på ingången formuläret : <br> <p> <style> <br> <p> error {color : red ; font . - weight: bold ; } <br> <p> < /style > Addera 3 <p> Skapa en JavaScript -funktion som kommer att kallas från mallen när användaren skickar HTML-formulär och kommer validera att användaren in information till varje inmatningsfält . Referera till enskilda formelement med sina namn och de Divar för de felmeddelanden som deras ID . Returnerar sant om valideringen lyckades och false om det inte var lyckat : <br> <p> <script> <br> <p> funktion validera ( ) { <br> <p> var nameError = document.getElementById ( " nameError " ) ; <br> <p> var emailError = document.getElementById ( " emailError " ) ; <br> <p> nameError.innerHTML = " " ; <br> <p> emailError.innerHTML = " " ; <br > <p> if ( document.contact.name.value == " " ) { <br> <p> nameError.innerHTML = " Du måste ange ett namn "; ! <br> <p> return false ; <br> <p> } <br> <p> om ( document.contact.email.value == " " ) { <br> <p> emailError.innerHTML = " Du måste ange en e-postadress "; ! <br> <p> returnera false; <br> <p> } <br> <p> return true ; <br> <p> } <br> <p> < /script > <br> <p> < /head > <br > <br> 4 <p> Skapa HTML kontaktformuläret . Tilldela samma namn med formen och de ingående som du använt i JavaScript -funktionen och samma ids till Divar felmeddelande . Skapa en skicka -knapp för formuläret och anropa JavaScript validering funktionen med " onSubmit " händelse , vilket gör att den form som skall behandlas om funktionen returnerar sant , men det kommer inte att skicka formuläret om funktionen returnerar false : <br> <p> <body> <br> <p> fyll i följande information för att lära mer om mitt företag : <br> <p> <form name="contact" onSubmit="return validate()"> <br> <p> Namn : <input type="text" name="name" width="30"> <span id="nameError" class="error"> < /span > <br > <p> Email : <input type="text" name="email" width="30"> <span id="emailError" class="error"> < /span > <br> <p> <input type="submit" name="submit" value="submit"> <br> <p> </form > <br> <p> < /body> <br> <p> < /html > <br> 5 <p> Spara HTML-filen och öppna den i en webbläsare . Testa att formen inte lämnar in om något av fälten kontaktinmatningspartier är tom . <br> <br> <div class=dad2><script language='javascript' src='/ad/201310/4.js'></script></div> <div class=dad3><script language='javascript' src='/ad/201310/33.js'></script></div> </div> </td> </tr> </table> <table class=dhang1 bgcolor="#DEE7EE"> <tr> <td></td> </tr> </table> <div class=dhang7></div> <table width="92%" height="51" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="50%"><p>Tidigare: <a class='LinkPrevArticle' href='http://www.dator.xyz/Programmering/javascript-programming/90950.html' >Hur du ändrar en Drop - Down Index i JavaScript </a></li></p></td> </tr> <tr> <td width="50%">nästa: <a class='LinkNextArticle' href='http://www.dator.xyz/Programmering/javascript-programming/90952.html' >Hur man beräknar ett glidande summa i JavaScript </a></li></td> </tr> </table></td> </tr> </table> <div class=dhang7></div> <table class=s770x246 > <tr> <td class=s375x246 ><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian"> <tr> <td height="244" valign="top"><table class=c1 > <tr> <td width="4%" height="29"> </td> <td width="96%" class="lan_lm"> relaterade artiklar </td> </tr> </table> <table width="95%" height="209" border="0" align="center" cellpadding="0" cellspacing="4"> <tr> <td height="201"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/91250.html" title="Hur du tar bort JavaScript-filer " target="_self">Hur du tar bort JavaScript-filer </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/90825.html" title="Hur Rotera ett chiffer i JavaScript " target="_self">Hur Rotera ett chiffer i JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/90826.html" title="Hur man tar bort jQuery dragspel Styling " target="_self">Hur man tar bort jQuery dragspel Styling </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/91179.html" title="Orsaker till en Java Script Void Error " target="_self">Orsaker till en Java Script Void Error </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/90877.html" title="Hur man tar bort en händelsehanterare i TinyMCE " target="_self">Hur man tar bort en händelsehanterare i TinyMCE </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/91244.html" title="Hur dölja en adressfältet i JavaScript " target="_self">Hur dölja en adressfältet i JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/91174.html" title="Tutorial på Javascript Bakgrund Effekter " target="_self">Tutorial på Javascript Bakgrund Effekter </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/90991.html" title="Hur Kontroll Marginaler i en JavaScript " target="_self">Hur Kontroll Marginaler i en JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/90757.html" title="Vad är händelsestyrd Bubblande " target="_self">Vad är händelsestyrd Bubblande </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/javascript-programming/90936.html" title="Ta reda på koordinaterna för ett element i JavaScript " target="_self">Ta reda på koordinaterna för ett element i JavaScript…</a></td></tr><tr></tr></table></td> </tr> </table></td> </tr> </table></td> <td width="20" valign="top"></td> <td width="375" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian"> <tr> <td height="244" valign="top"> <table class=c3 > <tr> <td width="4%" height="29"> </td> <td width="96%" class="lan_lm">Utvalda artiklarna </td> </tr> </table> <table class=c4 > <tr> <td height="199"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/computer-programming-languages/88642.html" title="Hur sortera kolumner i DataGrid " target="_self">Hur sortera kolumner i DataGrid </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/ruby-programming/94247.html" title="Konvertera Fästingar till ett datum " target="_self">Konvertera Fästingar till ett datum </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/java-programming/89140.html" title="Hur du ändrar JDK i BEA WebLogic 8.1 " target="_self">Hur du ändrar JDK i BEA WebLogic 8.1 </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/java-programming/90563.html" title="Hur får man en bild i Java " target="_self">Hur får man en bild i Java </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/computer-programming-languages/88779.html" title="Scrum metodik " target="_self">Scrum metodik </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/computer-programming-languages/87764.html" title="Hur man gör en anpassningsbar webbplats " target="_self">Hur man gör en anpassningsbar webbplats </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/cc-programming/85290.html" title="Hur man flyttar ett objekt genom att dra i XCode " target="_self">Hur man flyttar ett objekt genom att dra i XCode </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/php-mysql-programming/92911.html" title="Migrera från Access till MySQL Tutorial " target="_self">Migrera från Access till MySQL Tutorial </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/php-mysql-programming/92230.html" title="Hur man skickar data i MySQL med PHP " target="_self">Hur man skickar data i MySQL med PHP </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.dator.xyz/Programmering/visual-basics-programming/95872.html" title="Hur man skapar en ActiveX DLL i VB " target="_self">Hur man skapar en ActiveX DLL i VB </a></td></tr><tr></tr></table></td> </tr> </table></td> </tr> </table></td> </tr> </table></td> </tr> </table> <div class=dhang8></div> <div class=dhang1></div> <table class=b1> <tr> <td class=bs height=90 align=middle>Copyright © Dator Kunskap http://www.dator.xyz </td> </tr> </table> <div class=dhang1></div> </div> </body> </html>