Question

虽然这看起来像是非常基本的东西，但无论我尝试什么，我都无法理解它。基本上我想要一个html表单，用户在输入文本框中输入他们的ID号，当他们点击提交按钮时，它会显示他们的电子邮件地址，即公司ID号@ company.com，如下面

<form action=""> ID Number: <input
type="text" name="idnumber" /><br/>
<input type="submit" value="Whats my
email address" /> </form> <p>Your
email address is
'idnumber'@email.com</p>

甚至可以使用html完成，还是需要使用Javascript或PHP？

由于

Answer 1

的JavaScript

HTML

ID Number: <input
type="text" name="idnumber" id="idnumber" /><br/>
<p>Your
email address is
<span id="emailid"></span>@email.com</p>

的JavaScript

var input = document.getElementById('idnumber'),
    placeholder = document.getElementById('emailid');

input.onkeyup = function() {
   placeholder.innerHTML = input.value
}

jsFiddle

请务必附加到window.onload或DOM就绪事件。

此版本将在按键时更新 - 如果您想使用按钮，请参考按钮并使用事件onclick。

PHP

HTML / PHP

<form action="?" method="get"> ID Number: <input
type="text" name="idnumber" /><br/>
<input type="submit" value="Whats my
email address" /> </form> <p>Your
email address is
<?php echo isset($_GET['idnumber']) ? htmlspecialchars($_GET['idnumber']) : ''; ?>@email.com</p>

你也可以在这里使用POST，但是作为初学者，GET会更清晰（刷新时不会再调用浏览器的提交表单对话框。）

如果使用POST，您应该真正关注Post/Redirect/Get（维基百科网址可怕）。除非在这种情况下你需要一个值来持久化，你可以使用cookie，session或GET参数，更容易从get go中使用GET：）

Answer 2

php或javascript会帮助你。

<html>
<body>

<form action="welcome.php" method="post">
Name: <input type="text" name="name"><br>
E-mail: <input type="text" name="email" id="email"><br>
<input type="submit">
</form>

<div>
Welcome <?php echo $_GET["name"]; ?><br>
Your email address is: <?php echo $_GET["email"]; ?>
</div>
<p id="output"></p>

</body>
</html>

使用JavaScript 在html / php脚本中添加此代码

<script>
function getIndex() {
document.getElementById("output").innerHTML =
document.getElementById("email").selectedIndex;
}
</script>

在html上提交按钮以在同一页面上输出结果

2 个答案:

的JavaScript

HTML

的JavaScript

PHP

HTML / PHP