Javascript Password Promt με Password Field

Διδάσκοντες: Α. Καράκος, Αν. Καθηγητής

Javascript Password Promt με Password Field

Δημοσίευσηαπό Stokos » 22 Ιαν 2009, 17:12

Έχει καταφέρει κανένας να φτιάξει το prompt με password field αντί για text field? Δηλ. να δείχνει αστεράκια εκεί που γράφεις το password?

Έχω φάει το internet και τέτοιο έτοιμο scriptάκι δεν υπάρχει πουθενά, σε ένα φόρουμ μάλιστα βρήκα το εξής:

I don't think that the built-in prompt() can provide you with such functionality. Perhaps if there was a way to reference it as an object (αυτό δε γίνεται απ'όσο γνωρίζω), then you would be able to capture every character typed in, save it to a variable and replace it with an asterisk. But unfortunately it is just a function that returns a value (http://www.w3schools.com/js/js_popup.asp).

You could use a popup window alternative with <input type="password"/> in it.

Επίσης και εδώ φαίνεται ότι κάτι τέτοιο είναι μάλλον αδύνατο (με javascript πάντα): http://www.codingforums.com/archive/ind ... -8113.html
Ο μόνος τρόπος φαίνεται να είναι Server-side language...

Η λύση που προτείνει είναι αρκετά απογοητευτική...

Απ'όσο ξέρω ο υπεύθυνος του μαθήματος ζητά να έχει passwrod field το prompt αλλιώς δε το θεωρεί "σωστό". Επίσης από μια σύντομη περιήγηση στις εργασίες συμφοιτητών κανένας δε το έχει κάνει... Οπότε όποιος είναι μεγαλύτερο έτος ή έχει ασχοληθεί λίγο παραπάνω με προγραμματισμό στο διαδίκτυο ας μας προτείνει κάτι...
Stokos
 

Re: Javascript Password Promt με Password Field

Δημοσίευσηαπό kkalop » 22 Ιαν 2009, 18:18

Όντως κάτι τέτοιο δε γίνεται παρά μόνο εάν μέσα στο popup υπάρχει κώδικας για form (με την παράμετρο "password") και όχι javascript
Ίσως κάτι αντίστοιχο να γίνεται με php κώδικα αλλά δεν ξέρω αν σας δίνεται αυτή η δυνατότητα...

ορίστε ένα παράδειγμα που ίσως βοηθήσει

Κώδικας: Επιλογή όλων
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Javascript User Login</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<script language="javascript" type="text/javascript">
//
// Javascript User Login 3.0
// Some Rights Reserved
// http://webdeveloper.50webs.com
//

var userFolder = ""; // Folder where userfile (e.g. PizzaMan127~Cheese.htm) is located (e.g "users/")
var HTMLextention = ".htm"; // Extension of the user-file (usually .htm or .html)
var inProgressMSG = "Attempting login..."; // Message displayed during a login
var userFailMSG = "Invalid username or password"; // Message displayed after failed attempt

// Do not edit
function login(){
   var username= document.getElementById('username').value; // location of username
   var password= document.getElementById('password').value; // location of password
   username= username.toLowerCase(); // convert to lowercase for case-sensitive servers
   password= password.toLowerCase(); // convert to lowercase for case-sensitive servers
   var fullURL= "";
   fullURL= userFolder + username + "~" + password + HTMLextention; // compiled filename the loads user-file
   setTimeout("failEvents();", 15000); // after 15 seconds display error message
   document.getElementById('errorDisplay').value = inProgressMSG; // show in-progress message
   showMSG();
   setTimeout("showMSG();", 5000); // hide in-progress message after 5 seconds
   verifWin.document.open();
   verifWin.document.location.href = fullURL; // trys to find user-file
   verifWin.document.close();
}
function passEvents(data){ // Events that occur for valid login
   var URL = data;
   location.href=URL;
}
function failEvents(){ // Events that occur for invalid login
   document.getElementById('errorDisplay').value = userFailMSG;
   showMSG();
}
function showMSG() { // Controls the opening/closing of messages
   if ((document.getElementById("isShown_errorConsole").value)=="N") {
   document.getElementById("errorConsole").style.display='';
   document.getElementById("isShown_errorConsole").value="Y";}
   else if ((document.getElementById("isShown_errorConsole").value)=="Y") {
   document.getElementById("errorConsole").style.display='none';
   document.getElementById("isShown_errorConsole").value="N";}
}
</script>
<table width="250" border="0" cellpadding="1" cellspacing="5" bgcolor="#9FB8FF">
  <tr>
    <td bgcolor="#9FB8FF" align="center"><b><font size="4" color="#FFFFFF">Authorization Required</font></b></td>
  </tr>
  <tr>
    <td bgcolor="#FFFFFF"><form action="javascript:login();" method="get" name="LoginScript" id="LoginScript">
        <table border="0" cellspacing="10" cellpadding="0" width="100%">
          <tr>
            <td> Username</td>
            <td align="right"> <input name="username" id="username" type="text" style="border:1px solid #828177;" value="" /></td>
          </tr>
          <tr>
            <td> Password</td>
            <td align="right"> <input name="password" id="password" type="password" style="border:1px solid #828177;" value="" /></td>
          </tr>
          <tr>
            <td><iframe name="verifWin" src="" width="1" height="1" frameborder="0" border="0"></iframe></td>
            <td align="right"><input name="submit" type="submit" style="border:1px solid #9FB8FF;color:#FFFFFF;background-color:#9FB8FF;" value="Login" /></td>
          </tr>
        </table>
      </form></td>
  </tr>
    <tr>
    <td bgcolor="#FFFFFF"><input type="hidden" id="isShown_errorConsole" value="Y" />
   <span id="errorConsole" style="display:;">
   <input type="button" id="errorDisplay" style="width:100%;background-color:#FFFFFF;border:0px;" value="Error: Please enable Javascript" />
   </span><script language="javascript" type="text/javascript">showMSG();</script></td>
  </tr>
</table>
</body>
</html>
Άβαταρ μέλους
kkalop
Sr. Member
 
Δημοσιεύσεις: 475
Εγγραφή: 10 Ιαν 2008, 17:48
Τοποθεσία: Λαμία
Φοιτητής ΗΜΜΥ: Όχι

Re: Javascript Password Promt με Password Field

Δημοσίευσηαπό mther » 22 Ιαν 2009, 18:35

Στοκο μιλάς για την κύρια εργασία του μαθήματος; Γιατί από 'τι ξέρω δεν ζητάει κάτι τέτοιο για κωδικό.
mther
Jr. Member
 
Δημοσιεύσεις: 86
Εγγραφή: 23 Ιαν 2008, 01:52

Re: Javascript Password Promt με Password Field

Δημοσίευσηαπό m.j. » 22 Ιαν 2009, 18:45

Stokos έγραψε:Απ'όσο ξέρω ο υπεύθυνος του μαθήματος ζητά να έχει passwrod field το prompt αλλιώς δε το θεωρεί "σωστό".

Επίσης ο ..υπεύθυνος του μαθήματος την προηγούμενη φορά στο μάθημα έλειπε και απο ό,τι κυκλοφόρησε γενικά στα πηγαδάκια..μια χαρά μαθηματάκι έγινε με τον "δανεικό" καθηγητή!
δεν λέω αλλα,τα συμπεράσματα δικά σας.
και επίσης και οι σπαζοκεφαλιές!
μάθε html σερφάροντας..απορώ γιατί στο καλό έχει εργαστήρια..αφού υπολογιστή και ίντερνετ έχω και σπίτι μου δόξα τον Θεό..ε?ναι.

με συγχωρείτε για το offtopic σχολιάκι..δεν κρατήθηκα ::)
peace just wanted to be free.
m.j.
Sr. Member
 
Δημοσιεύσεις: 304
Εγγραφή: 18 Μάιος 2008, 14:58
Τοποθεσία: ..το υπερπέραν..

Re: Javascript Password Promt με Password Field

Δημοσίευσηαπό Stokos » 22 Ιαν 2009, 18:55

kkalop έγραψε:Όντως κάτι τέτοιο δε γίνεται παρά μόνο εάν μέσα στο popup υπάρχει κώδικας για form (με την παράμετρο "password") και όχι javascript
Ίσως κάτι αντίστοιχο να γίνεται με php κώδικα αλλά δεν ξέρω αν σας δίνεται αυτή η δυνατότητα...

ορίστε ένα παράδειγμα που ίσως βοηθήσει

Κώδικας: Επιλογή όλων
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Javascript User Login</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<script language="javascript" type="text/javascript">
//
// Javascript User Login 3.0
// Some Rights Reserved
// http://webdeveloper.50webs.com
//

var userFolder = ""; // Folder where userfile (e.g. PizzaMan127~Cheese.htm) is located (e.g "users/")
var HTMLextention = ".htm"; // Extension of the user-file (usually .htm or .html)
var inProgressMSG = "Attempting login..."; // Message displayed during a login
var userFailMSG = "Invalid username or password"; // Message displayed after failed attempt

// Do not edit
function login(){
   var username= document.getElementById('username').value; // location of username
   var password= document.getElementById('password').value; // location of password
   username= username.toLowerCase(); // convert to lowercase for case-sensitive servers
   password= password.toLowerCase(); // convert to lowercase for case-sensitive servers
   var fullURL= "";
   fullURL= userFolder + username + "~" + password + HTMLextention; // compiled filename the loads user-file
   setTimeout("failEvents();", 15000); // after 15 seconds display error message
   document.getElementById('errorDisplay').value = inProgressMSG; // show in-progress message
   showMSG();
   setTimeout("showMSG();", 5000); // hide in-progress message after 5 seconds
   verifWin.document.open();
   verifWin.document.location.href = fullURL; // trys to find user-file
   verifWin.document.close();
}
function passEvents(data){ // Events that occur for valid login
   var URL = data;
   location.href=URL;
}
function failEvents(){ // Events that occur for invalid login
   document.getElementById('errorDisplay').value = userFailMSG;
   showMSG();
}
function showMSG() { // Controls the opening/closing of messages
   if ((document.getElementById("isShown_errorConsole").value)=="N") {
   document.getElementById("errorConsole").style.display='';
   document.getElementById("isShown_errorConsole").value="Y";}
   else if ((document.getElementById("isShown_errorConsole").value)=="Y") {
   document.getElementById("errorConsole").style.display='none';
   document.getElementById("isShown_errorConsole").value="N";}
}
</script>
<table width="250" border="0" cellpadding="1" cellspacing="5" bgcolor="#9FB8FF">
  <tr>
    <td bgcolor="#9FB8FF" align="center"><b><font size="4" color="#FFFFFF">Authorization Required</font></b></td>
  </tr>
  <tr>
    <td bgcolor="#FFFFFF"><form action="javascript:login();" method="get" name="LoginScript" id="LoginScript">
        <table border="0" cellspacing="10" cellpadding="0" width="100%">
          <tr>
            <td> Username</td>
            <td align="right"> <input name="username" id="username" type="text" style="border:1px solid #828177;" value="" /></td>
          </tr>
          <tr>
            <td> Password</td>
            <td align="right"> <input name="password" id="password" type="password" style="border:1px solid #828177;" value="" /></td>
          </tr>
          <tr>
            <td><iframe name="verifWin" src="" width="1" height="1" frameborder="0" border="0"></iframe></td>
            <td align="right"><input name="submit" type="submit" style="border:1px solid #9FB8FF;color:#FFFFFF;background-color:#9FB8FF;" value="Login" /></td>
          </tr>
        </table>
      </form></td>
  </tr>
    <tr>
    <td bgcolor="#FFFFFF"><input type="hidden" id="isShown_errorConsole" value="Y" />
   <span id="errorConsole" style="display:;">
   <input type="button" id="errorDisplay" style="width:100%;background-color:#FFFFFF;border:0px;" value="Error: Please enable Javascript" />
   </span><script language="javascript" type="text/javascript">showMSG();</script></td>
  </tr>
</table>
</body>
</html>


Ευχαριστώ πολύ kkalop, θα το ψάξω και θα δω ;)

---
mther έγραψε:Στοκο μιλάς για την κύρια εργασία του μαθήματος; Γιατί από 'τι ξέρω δεν ζητάει κάτι τέτοιο για κωδικό.

Όχι για την εργαστηριακή εργασία με τα Javascript.

---

m.j. έγραψε:
Stokos έγραψε:Απ'όσο ξέρω ο υπεύθυνος του μαθήματος ζητά να έχει passwrod field το prompt αλλιώς δε το θεωρεί "σωστό".

Επίσης ο ..υπεύθυνος του μαθήματος την προηγούμενη φορά στο μάθημα έλειπε και απο ό,τι κυκλοφόρησε γενικά στα πηγαδάκια..μια χαρά μαθηματάκι έγινε με τον "δανεικό" καθηγητή!
δεν λέω αλλα,τα συμπεράσματα δικά σας.
και επίσης και οι σπαζοκεφαλιές!
μάθε html σερφάροντας..απορώ γιατί στο καλό έχει εργαστήρια..αφού υπολογιστή και ίντερνετ έχω και σπίτι μου δόξα τον Θεό..ε?ναι.

με συγχωρείτε για το offtopic σχολιάκι..δεν κρατήθηκα ::)

Παρακαλώ το θάψιμό σας εδώ. Ευχαριστωωω ;D
Stokos
 

Μέλη σε σύνδεση

Μέλη σε αυτή την Δ. Συζήτηση : Δεν υπάρχουν εγγεγραμμένα μέλη και 1 επισκέπτης