restituendo false non interrompendo l'invio del modulo

Il mio scopo: se il campo utente e il campo password sono vuoti, voglio interrompere l'invio del modulo. Questo è il mio codice che sto cercando:restituendo false non interrompendo l'invio del modulo

<!DOCTYPE html> 
<html> 
<head> 
    <script> 
     function doit() { 

      var usr = document.getElementById('ur').value; 
      var psw = document.getElementById('pw').value; 

      if ((usr.trim() == '') && (psw.trim() == '')) { 
       alert("cannot Submit form"); 
       return false; 
      } 

     } 
    </script> 

</head> 


<body> 

    <form action="post.php" method="post" onsubmit="doit()"> 
     User: 
     <input type="text" id="ur" name="user"> 
     <br> 
     <br> Pass: 
     <input type="password" id="pw" name="pass"> 
     <br> 
     <br> 
     <button>Submit</button> 
    </form> 


</body> 
</html>

sto imparando JavaScript. Sarà utile se correggi il codice con una piccola spiegazione del perché non funziona.

fonte

2015-04-23 Asif Iqbal

aggiungere 'required' ani ma ai tuoi input, nei browser moderni l'effetto sarà lo stesso. E nella tua funzione userei l'operatore OR, non AND - entrambi i valori non dovrebbero essere vuoti. –

return false sta lavorando bene, il modo in cui sono chiedono quella funzione è sbagliato.

<form action="post.php" method="post" onsubmit="doit()">

Proprio lo chiama, non fare nulla con il valore di ritorno

<form action="post.php" method="post" onsubmit="return doit()"> 
               ^

si fermerà il palo modulo a un valore restituito falso.

Leggere questa nota su MSDN anche se non è cioè specifico

È possibile ignorare questo evento restituendo falso nel gestore di eventi. Utilizzare questa funzionalità per convalidare i dati sul lato client per impedire che i dati non validi vengano inviati al server. Se il gestore eventi viene chiamato dall'attributo onsubmit dell'oggetto modulo, il codice deve richiedere esplicitamente il valore restituito utilizzando la funzione return e il gestore eventi deve fornire un valore di ritorno esplicito per ogni possibile percorso di codice nella funzione gestore eventi .

Ora su un altro punto importante.

La condizione if interromperà l'invio del modulo solo quando entrambi i campi sono vuoti, mentre dovrebbe farlo anche se uno di questi due campi è vuoto. Che && (AND) dovrebbe essere un || (OR) e alla fine delle tue funzioni se nulla è restituito falso, return true quindi.

fonte

2015-04-23 07:11:31

Riguardo * * il gestore di eventi deve fornire un valore di ritorno esplicito per ogni possibile percorso di codice nella funzione di gestore di eventi * - non dimenticare di aggiungere un 'return true;' (o qualcos'altro) alla fine di 'doit () '! – Bob

@Bob - l'aggiunta di 'return true' alla fine non è necessaria, anche se sarebbe bello perché evita di ricevere un avviso" non tutti i percorsi restituiscono un valore "in alcuni editor e controllori di lanugine. Ma il codice funzionerà correttamente senza di esso. Se cadi fuori dalla fine della funzione senza un 'return', la funzione restituisce' undefined', che non è lo stesso valore di 'false'. Si consideri il caso comune di un gestore di eventi che non restituisce mai 'true' o' false' o alcun valore - tale funzione consentirebbe di inviare il modulo. Devi esplicitamente restituire false per impedire l'invio. –

@MichaelGeary Prendendo letteralmente la sezione quotata, se il gestore * deve * fornire un valore di ritorno * esplicito, allora non sarebbe corretto fare affidamento sull'implicito 'indefinito'. In pratica, ciò che dici funzionerà su tutti i browser correnti al meglio delle mie conoscenze e potrebbe anche essere più corretto in base alle specifiche HTML/ECMAScript (non ho il tempo di controllare), ma se dovessimo prendere l'articolo MSDN alla sua parola quindi il valore di ritorno esplicito è * obbligatorio *. (Anche se questo è MSDN e IE-focalizzato potrebbe riguardare VBS solo per quello che so ...) – Bob

onsubmit l'evento accetta valori booleani, poiché non si restituisce nulla, pertanto si presume vero per impostazione predefinita. Devi aggiungere il reso in questo evento.

cambiamento

onsubmit="doit()">

onsubmit="return doit()">

fonte

2015-04-23 07:11:49

Utilizzando addEventListener su submit con preventDefault()

document.form1.addEventListener("submit", function(event) { 
 

 
     var usr = document.getElementById('ur').value; 
 
     var psw = document.getElementById('pw').value; 
 

 
     if ((usr.trim() == '') || (psw.trim() == '')) { 
 
     alert("cannot Submit form"); 
 
     event.preventDefault(); 
 
     } else { 
 
     alert("submit"); 
 
     } 
 

 
    });

<form action="" method="post" name="form1"> 
 
    User: <input type="text" id="ur" name="user"><br><br> 
 
    Pass: <input type="password" id="pw" name="pass"><br><br> 
 
    <input type="submit" value="Submit" /> 
 
    </form>

fonte

2017-12-19 09:49:07 antelove

restituendo false non interrompendo l'invio del modulo

risposta

Problemi correlati