User Ask Question: I am Need to design HTML page with Button for password ask, script for my website design purpose.
Answers:
Generally all login form contains username , password enter options available , but some cases need to password after username available in database, that time only ask password, next check given username and password correct or not.
For this type of front design of any website use HTML, CSS, JavaScript code very suitable. In this article we provide some answers for Enter Username , next ask Password HTML page display.
Check following as design HTML page with Button for password
Login Form
You check online manual applying HTML Page with Button for password
HTML Code : Button for Password
See below code and note that
<div style="background:#FFFF99; padding:5px; width:350px;">
<h2 style="text-align:center; text-decoration:underline; color:#0066FF;"> Login Form</h2>
<form action="">
<label for="uname"><b>Username</b></label>
<input type="text" placeholder="Enter Username" name="uname" required />
<div id="pass1">
<label for="uname"><b>Password</b></label>
<input type="text" placeholder="Enter Password" name="pname" required />
</div>
<br/>
<button id="pclick" type="submit">Password</button>
</form>
</div>
Next see belowJavaScript code : Button for Password
<script>
$(document).ready(function(){
$("#pass1").hide();
$("#pclick").click(function(){
$("#pass1").show();
});
});
</script>
For Complete HTML page for Button for Password
<html>
<head>
<title>Need to design HTML page with Button for password</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<div style="background:#FFFF99; padding:5px; width:350px;">
<h2 style="text-align:center; text-decoration:underline; color:#0066FF;"> Login Form</h2>
<form action="">
<label for="uname"><b>Username</b></label>
<input type="text" placeholder="Enter Username" name="uname" required />
<div id="pass1">
<label for="uname"><b>Password</b></label>
<input type="text" placeholder="Enter Password" name="pname" required />
</div>
<br/>
<button id="pclick" type="submit">Password</button>
</form>
</div>
<script>
$(document).ready(function(){
$("#pass1").hide();
$("#pclick").click(function(){
$("#pass1").show();
});
});
</script>
</body>
</html>
Finally see
OUTPUT : HTML page with Button for password
0 Comments:
Post a Comment