Html ne pas appeler les fonctions javascript

J'essaye de coder une petite page Web html5 qui demande à un utilisateur de taper un commentaire et son adresse e-mail. S'ils n'envoient pas de commentaire et/ou d'e-mail, ils seront invités via javascript pour corriger leur entrée. Le problème que j'ai est que le javascript ne fonctionne pas du tout. Je pense que c'est complètement ignoré. S'il vous plaît me dire où je vais mal ...Html ne pas appeler les fonctions javascript

 <!DOCTYPE HTML> 
<html lang="en-US"> 
<link rel="icon" type="image/png" href="img/favicon.png"> 
<link rel="stylesheet" type="text/css" href="css/new.css"> 
<title>Comments</title> 
</head> 
<body> 
<nav id="navbar"> Navigation: 
    <table><tr> 
     <td><a href="bio.html">Bio</a></td> 
     <td><a href="resume.html">Resume</a></td> 
     <td><a href="classes.html">Classes</a></td> 
     <td><a href="new.html">New</a></td> 
    </tr></table> 
</nav> 

<header> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
<script type="text/javascript> 


function yay() { 
if (document.poop.melon.value == "" || document.poop.melon.value == "Type comment here!" || document.poop.melon.value == "...") 
{ 
    alert ("Fill in the comment box you poopyhead!"); 
    document.poop.melon.value = "Type comment here!"; 
    return false; 
} 
if (document.poop.maplestory.value == "[email protected]" || document.poop.maplestory.value == "" || maplestory (document.poop.maplestory.value)){ 
    alert ("Dear Sir or Madam, please type in your e-mail address."); 
    return false; 
} 
    return true; 
    } 

function maplestory( yummy ) 
{ 
   var regex = /^[AZ09._%+][email protected][AZ09.]+\.[AZ]{2,4}$/i; 
   if(yummy.search(regex) == -1) 
     return true ; 
   return false ; 
} 

</script> 


</header> 

<h2>Leave a delicious comment below:</h2> 
<form name="poop" id="poop" method="POST" action="http://www.webdevfoundations.net/scripts/formdemo.asp" onsubmit="return yay();"> 
<textarea name="melon" id="melon" cols="35" rows="10">...</textarea><br> 
<label for "maplestory">E-mail</label>:<br><textarea name="maplestory" id="maplestory" cols="35" rows="1">[email protected]</textarea><br> 
<input id="submit" type="submit" value="Submit"></form> 


<footer><div class="right"> name &copy; 2010 </div></footer> <!-- It's a shame there's no unicode for the copyleft symbol :(--> 
</body> 
</html>

Source

2010-12-16 에이바

Avez-vous des erreurs javascript? –

Il y a plusieurs problèmes avec votre source arrêté Javascript de fonctionnement:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

Vous n'avaient pas les guillemets fermants pour l'attribut src. Cela a fait que le DOM a tout interprété comme une partie de l'attribut src, tout bousiller.

function maplestory(yummy) 
{

Vous aviez un support bouclé de fermeture au lieu d'un support d'ouverture. Cela a provoqué une erreur d'analyse car Javascript attendait une parenthèse bouclée d'ouverture.

if(yummy.search(regex) == 1)

Vous avez eu un caractère invisible avant le 1. Celui-ci a été particulièrement difficile à trouver, je devais utiliser mon débogueur Javascript pour le trouver.

<label for="maplestory">E-mail</label>:<br><textarea name="maplestory" id="maplestory" cols="32" rows="1">[email protected]</textarea><br>

Cela ne devrait pas affecter votre problème, mais vous étiez manque le signe égal entre le for et le "maplestory".

Puisque vous semblez avoir du mal à le faire fonctionner, copier et coller le ci-dessous et voir si cela fonctionne. (Pour moi, sans éditer les zones de texte, si vous cliquez sur le bouton "Soumettre", vous recevez une alerte immédiatement). Si cela ne fonctionne pas, laissez-moi savoir quel navigateur vous utilisez.

<!DOCTYPE HTML> 
    <html lang="en-US"> 
    <link rel="icon" type="image/png" href="img/favicon.png"> 
    <link rel="stylesheet" type="text/css" href="css/new.css"> 
    <title>Comments</title> 
    </head> 
    <body> 
    <nav id="navbar"> Navigation: 
    <table><tr> 
     <td><a href="bio.html">Bio</a></td> 
     <td><a href="resume.html">Resume</a></td> 
     <td><a href="classes.html">Classes</a></td> 
     <td><a href="new.html">New</a></td> 
    </tr></table> 
    </nav> 

    <header> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
<script type="text/javascript"> 
    function yay(){ 
    if (document.poop.melon.value == "" || document.poop.melon.value == "Type comment here!" || document.poop.melon.value == "...") 
    { 
    alert ("Fill in the comment box!"); 
    document.poop.melon.value = "Type comment here!"; 
    return false; 
    } 
    if (document.poop.maplestory.value == "[email protected]" || document.poop.maplestory.value == "" || maplestory (document.poop.maplestory.value)){ 
    alert ("Dear Sir or Madam, please type in your e-mail address."); 
    return false; 
    } 
    return true; 
    } 

    function maplestory(yummy) 
    { 
     var regex = /^[AZ09._%+][email protected][AZ09.]+\.[AZ]{2,4}$/i; 
     if(yummy.search(regex) == -1) 
     return true ; 
     return false ; 
    } 

    </script> 


    </header> 

    <h2>Leave a poopy comment below:</h2> 
    <form name="poop" id="poop" method="POST" action="http://www.webdevfoundations.net/scripts/formdemo.asp" onsubmit="return yay();"> 
    <textarea name="melon" id="melon" cols="32" rows="10">...</textarea><br> 
    <label for="maplestory">E-mail</label>:<br><textarea name="maplestory" id="maplestory" cols="32" rows="1">[email protected]</textarea><br> 
    <input id="submit" type="submit" value="Submit"></form> 


    <footer><div class="right"> name &copy; 2010 </div></footer> <!-- It's a shame there's no unicode for the copyleft symbol :(--> 
    </body> 
    </html>

Source

2010-12-16 06:02:38 waiwai933

Intéressant la valeur 1 était supposé être -1? J'ai réparé toutes ces choses mais toujours pas de dés :( –

@ 에이 바 I'v J'ai collé un fichier qui fonctionne pour moi dans ma réponse. – waiwai933

Merci cela semble fonctionner. Je peux enfin finir le reste de ce script! :RÉ –

utiliser une balise de script distinct pour le jquery, et pour votre javascript comme ceci:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"> 
</script> 
<script type="text/javascript"> 
function yay() {

aussi, où est la fonction d'action déclarée ?

MISE À JOUR: pourrait-il être parce que vous utilisez un} au lieu d'un {sur la ligne après function maplestory(yummy)?

Source

2010-12-16 05:41:30

Hm. J'ai essayé mais ça ne semble toujours pas fonctionner. Y a-t-il une raison spécifique de les séparer? –

–

non, la fonction d'action étant appelée en action ("Remplissez la boîte de commentaire!" –

J'ai trouvé this de blog de John Resig

balises de script qui référence les ressources externes ne peuvent pas être en mesure d'exécuter des scripts inlined.

Source

2010-12-16 05:47:12

J'ai corrigé ça, mais ça n'appelle toujours pas le javascript correctement –

Pouvez-vous mettre un' alert ("1") 'instruction en tant que première ligne dans le script inline et essayez et encore une chose de fermer la balise de script avec la balise'' appropriée pas comme '

onsubmit="return yay();"

ne devrait pas avoir un espace entre la parenthèse.

onsubmit="return yay();"

Source

2010-12-16 05:55:42 DaveB

ne va pas faire une différence –

Html ne pas appeler les fonctions javascript

Répondre

Questions connexes