Welkom, Gast. Je bent niet ingelogd.
🔥Registreren Inloggen 😎

js Type veranderen

Forum Developing & Coding Javascript Topic
Reageren 💬 Nieuw topic 📂
Thomaz
'
369 posts
Geplaatst op: 20 Jun 2007, 21:45
PimpCoins: 0
💸+
Bewerken Quote

Hallo allemaal,

Ik was even bezig met een Signchat, (Ja ouderwets maargoed). Ik zocht nu eigenlijk iets, dat als je op een input veld klikt, dan dat het type veranderd van text naar password.

Ik had dit al geprobeerd:

eerste poging:

1
2
3
4
<form id="login_form" style="margin: 0px;">
              <input type="text" name="user" value="Gebruikersnaam" onclick="if( this.value='Gebruikersnaam' ) { this.value=''; }" style="background: #FFFFFF; height: 14px; border: none; width: 99%;"/><br />
              <input type="text" name="pass" value="Wachtwoord" onclick="if( this.value='Wachtwoord' ) { this.value=''; }; this.type='password';" style="background: #D3DDE7; height: 14px; border: none; width: 99%;" />
            </form>

En daarna probeerde ik:

1
2
3
4
5
6
7
8
9
10
11
12
<script language="javascript" type="text/javascript">
        this.style = "text";
        
        password(){
        this.style = "password";
        }
    </script>            

<form id="login_form" style="margin: 0px;">
              <input type="text" name="user" value="Gebruikersnaam" onclick="if( this.value='Gebruikersnaam' ) { this.value=''; }" style="background: #FFFFFF; height: 14px; border: none; width: 99%;"/><br />
              <input type="this.style();" name="pass" value="Wachtwoord" onclick="if( this.value='Wachtwoord' ) { this.value=''; }; password();" style="background: #D3DDE7; height: 14px; border: none; width: 99%;" />
            </form>

Maar dit ook helaas zonder resultaat.

Weet iemand een andere manier die wel werkt?

Bvd. Thomas

Met je pik in het zand, draait de wereld om je ballen..
Syncie
478 posts
Geplaatst op: 21 Jun 2007, 14:49
PimpCoins: 0
💸+
Bewerken Quote

Het script hieronder alert de field-type. Maar veranderen lukt me niet, IE is steeds de boosdoener, ik denk dat dat onmogelijk is. Hieronder laat ik zien hoe je de type van een form-field laat zien. En daaronder heb ik een vieze manier van hoe je het wel kan laten veranderen.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

    <head>
    
        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">>
    
        <title>Form test</title>
        
        <script language="JavaScript" type="text/javascript">
            
            function setPassword(){
                
                var $type    =    document.forms['login'].pass.type;
                
                alert($type);
                
            }
            
        </script>
        
    </head>
    
    <body>
    
        <form id="login" method="post" action="index.php">
                        
            <input type="text" name="user" value="Gebruikersnaam" onclick="if( this.value='Gebruikersnaam' ) { this.value=''; }" style="background: #FFFFFF; height: 14px; border: none; width: 99%;"/>
            
            <input type="text" name="pass" id="pass" value="Wachtwoord" onclick="if( this.value='Wachtwoord' ) { this.value=''; }; setPassword();" style="background: #D3DDE7; height: 14px; border: none; width: 99%;" /> 
            
            <input type="submit" value="inloggen" />
            
        </form>
    
    </body>

</html>

Deze vieze manier werkt wel:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

    <head>
    
        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">>
    
        <title>Form test</title>
        
        <script language="JavaScript" type="text/javascript">
            
            function setPassword(){
                
                document.getElementById('password').innerHTML    =    '<input type="password" name="pass" id="pass" style="background: #D3DDE7; height: 14px; border: none; width: 99%;" /> ';
                
            }
            
        </script>
        
    </head>
    
    <body>
    
        <form id="login" method="post" action="index.php">
                        
            <input type="text" name="user" value="Gebruikersnaam" onclick="if( this.value='Gebruikersnaam' ) { this.value=''; }" style="background: #FFFFFF; height: 14px; border: none; width: 99%;"/>
            
            <div id="password">
            
                <input type="text" name="pass" id="pass" value="Wachtwoord" onclick="if( this.value='Wachtwoord' ) { this.value=''; }; setPassword();" style="background: #D3DDE7; height: 14px; border: none; width: 99%;" /> 
            
            </div>
            
            <input type="submit" value="inloggen" />
            
        </form>
    
    </body>

</html>

[Laatst bewerkt door Syncie op donderdag 21 juni 2007, om 16:04]
Reageren 💬 Nieuw topic 📂

Saven is back bitches

📊

Actieve topics

🔥

Nieuwste topics

🆕

Laatste blogs

📝

Laatste nieuws

📰
📫

Nieuw privébericht
🔥

Registreren

Login