获取 HTML 文本输入的值答案

【问题标题】：Getting value of HTML text input获取 HTML 文本输入的值
【发布时间】：2012-01-10 18:30:46
【问题描述】：

假设我有一个这样的 HTML 表单来收集来自网站访问者的电子邮件：

<form name="input" action="handle_email.php" method="post">
Email: <input type="text" name="email" />
<input type="submit" value="Newsletter" />
</form>

现在，当按下提交按钮时，我可以使用 $_POST["email"] 获取 handle_email.php 中电子邮件字段的值。但是假设我想在其他地方使用电子邮件文本输入的值。是否可以在表单处理“之外”获取电子邮件值？

更新：感谢大家的快速回复。我想要做的是让邮箱做双重任务。例如，我在上面的代码中将提交按钮重命名为“Newsletter”。当按下该按钮时，handle_email.php 脚本只会为用户注册一份时事通讯。但是，我在同一页面上也有一个“注册”链接，该链接将访问者重定向到一个注册表单，如果他们愿意，他们可以在其中输入许多其他信息。现在，如果用户碰巧在电子邮件文本框中输入了数据，我想将其发送到注册页面，以便可以预先填充该字段。例如：

<a href="http://mywebsite.com/register?user_email="[how can I put the email here?]"/>Register</a>

对于我的原始帖子不够清楚，我深表歉意。

【问题讨论】：

您还想在哪里使用电子邮件字段的值？如果它在同一个页面中，那么 JavaScript（或 jQuery）就可以了。
我已经用更多信息更新了我的问题。
使用会话，正如我在帖子中所指示的那样。会议是你唯一的希望！！！
但是您的示例只有在用户在注册链接之前按下时事通讯按钮时才有效，对吗？我希望它在没有这个限制的情况下工作。

标签： html forms input

【解决方案1】：

如果您想在同一页面的其他地方使用电子邮件输入的值，例如进行某种验证，您可以使用 JavaScript。首先，我会为您的电子邮件文本框分配一个“id”属性：

<input type="text" name="email" id="email"/>

然后我会用 JavaScript 检索值：

var email = document.getElementById('email').value;

从那里，您可以对“电子邮件”的值进行额外处理。

【讨论】：

【解决方案2】：

在这里查看我的 jsFiddle：http://jsfiddle.net/fuDBL/

每当您更改电子邮件字段时，链接都会自动更新。这需要少量的 jQuery。所以现在您的表单将根据需要工作，但您的链接将动态更新，以便当有人点击它时，它包含他们在电子邮件字段中输入的内容。您应该验证接收页面上的输入。

$('input[name="email"]').change(function(){
  $('#regLink').attr('href')+$('input[name="email"]').val();
});

【讨论】：

【解决方案3】：

取决于您想在哪里使用电子邮件。如果它在客户端，无需将其发送到 PHP 脚本，JQuery（或 javascript）就可以解决问题。

我创建了一个小提琴来解释相同的 - http://jsfiddle.net/qHcpR/

当您点击文本框本身时，它会在加载时发出警报。

【讨论】：

【解决方案4】：

如果您的页面在提交时刷新 - 是的，但只能通过查询字符串：http://www.bloggingdeveloper.com/post/JavaScript-QueryString-ParseGet-QueryString-with-Client-Side-JavaScript.aspx（那么您必须使用方法“GET”）。否则，您可以从 php 脚本中返回其值。

【讨论】：

【解决方案5】：

是的，你可以使用 jQuery 来完成这个，想法是

在表单中使用隐藏值，并在提交表单之前将值从外部文本框中复制到该隐藏值。

<form name="input" action="handle_email.php" method="post">
  <input type="hidden" name="email" id="email" />
  <input type="submit" value="Submit" />
</form> 

<script>
   $("form").submit(function() {
     var emailFromOtherTextBox = $("#email_textbox").val();
     $("#email").val(emailFromOtherTextBox ); 
     return true;
  });
</script>

另见http://api.jquery.com/submit/

【讨论】：