How can I create two buttons in a row for an HTML form?
I would like to create an HTML form with one 开发者_JAVA百科field for user name, a second under it for password, and then below that a row containing two buttons, one to login and another to register.
I want the 'Log In' button to submit the form. I don't want the register button to submit the form, but rather take the user to a different page. How can I get the two buttons to appear in row with each other and have the behavior that I described?
To me, it's important to at least try to use just plain old HTML, no JS or PHP or any kind of script:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" >
<title>Pure HTML submit and link buttons</title>
</head><body>
<div>
<form action="http://www.mysite.com/login.html" method="post">
<p><input type="submit" value = "Log In">
<a href ="http://www.mysite.com/register.html"><span>
<input type="button" value = "Register"></span></a></p>
</form>
<a href=""http://validator.w3.org/#validate_by_input">html valid?</a>
</body></html>
<input type="button" value=" Log in " onclick="document.form.action='http://example.com/loginPage.php'; document.form.submit();">
<input type="button" value=" Register " onclick="document.form.action='http://example.com/registrationPage.php'; document.form.submit();">
you can do this with some PHP:
The HTML file:
<form method="post" action= "action.php">
Name : <input type="text" name="name"/><br /><br />
<input type="submit" value="b1" name="action" />
<input type="submit" value="b2" name="action" /><br /><br />
</form>
The PHP action file:
<?php
echo "<h1> Hello $name </h1>";
if ($action == "b1")
echo "you just clicked button 1";
if ($action == "b2")
echo "you just clicked button 2";
?>
use those in one row inside <span></span>
those in different rows inside <div></div>
You can checkout <table> as well, but it's not the trend nowadays ;)
a little code to get you started:
<form>
<div>name: <input></input></div>
<div>password: <input></input></div>
<div><span><button>Login</button></span> <span><button>Register</button></span></div>
</form>
Be aware, that this code is just an illustration for the basic layouting, not a working code. Submitting from a form, and the used elements can vary depending on your exact requirements.
With ONLY plain HTML i don't think you can submit and redirect to two separate pages. Either use a server side language to find out which button was clicked and login/redirect accordingly.
Or use a submit button and text with a anchor tag for the registration link.
加载中,请稍侯......
精彩评论