【问题标题】:Validate Email in Google Forms在 Google 表单中验证电子邮件
【发布时间】:2014-09-12 06:13:33
【问题描述】:

我正在使用 Google 表单来收集姓名和电子邮件地址以供订阅简报。电子邮件地址字段只是 Google 表单中的一个文本字段,因此它可以接受任何文本。

我的目标是验证电子邮件地址以确保已输入电子邮件地址而不是任何 ole 文本。下面是 Google 表单的代码。我可以添加什么代码来验证电子邮件地址字段?

<form action="http://spreadsheets.google.com/formResponse?key=pqbhTz7PIHum_4qKEdbUWVg&amp;embedded=true" method="post" target="hidden_iframe" onsubmit="submitted=true;">

<h1>Styled Google form with confirmation redirect</h1>
<div class="errorbox-good">
<div class="ss-form-entry"><label for="entry_1" class="ss-q-title">Your Name?
</label>
<label for="entry_1" class="ss-q-help"></label>
<input type="text" name="entry.1.single" value="" class="ss-q-short" id="entry_1"></div></div>
<br> <div class="errorbox-good">
<div class="ss-form-entry"><label for="entry_2" class="ss-q-title">Your Email?
</label>
<label for="entry_2" class="ss-q-help"></label>
<input type="text" name="entry.2.single" value="" class="ss-q-short" id="entry_2"></div></div>
<br> <div class="errorbox-good">
<div class="ss-form-entry"><label for="entry_3" class="ss-q-title">How easy was this tutorial?
</label>

<label for="entry_3" class="ss-q-help"></label>
<ul class="ss-choices"><li class="ss-choice-item"><input type="radio" name="entry.3.group" value="Very easy!" class="ss-form-input" id="group_3_1">
<label class="ss-choice-label" for="group_3_1">Very easy!</label></li> <li class="ss-choice-item"><input type="radio" name="entry.3.group" value="Pretty easy" class="ss-form-input" id="group_3_2">
<label class="ss-choice-label" for="group_3_2">Pretty easy</label></li> <li class="ss-choice-item"><input type="radio" name="entry.3.group" value="Not easy" class="ss-form-input" id="group_3_3">
<label class="ss-choice-label" for="group_3_3">Not easy</label></li>
</ul></div></div>
<br>
<input type="hidden" name="pageNumber" value="0">
<input type="hidden" name="backupCache" value="">
<input type="submit" name="submit" value="Submit">
</form>

【问题讨论】:

  • 您也可以使用必填字段。在您的输入标签中添加 required="" 并输入 = "email" 进行电子邮件验证
  • 最新浏览器版本提供。它会在表单提交时自动验证电子邮件输入。
  • 感谢大家提到 这确实对我有用,但它不检查“句号”,这很糟糕。因此它会接受诸如 bob@yahoo 这样没有 .com 的电子邮件 ----- 请让我知道任何其他方法!
  • 感谢分享该链接@herr 这对我有用,而且非常简单。但是,有一个问题,我使用 XHTML 是否重要? 是否仅对 HTML5 有效?

标签: javascript php jquery forms google-forms


【解决方案1】:

您可以使用正则表达式在 jquery 中轻松验证电子邮件:

<script type="text/javascript">

function ValidateEmail(email) {
    var expr = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
    return expr.test(email);
};
$("#btnsubmit").on("click", function () {
    if (!ValidateEmail($("#entry_2").val())) {
        alert("Invalid email address.");
        return false;
    }
    else {
         // Valid email address
    }
});

</script>

并为您的提交按钮分配一个 id:

<input type="submit" name="submit" id='btnsubmit' value="Submit">

在您的表单上添加 Jquery 引用:

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

DEMO

【讨论】:

  • 此代码对我不起作用。我还在 WordPress 2012 主题中对其进行了测试。我的 Google 表单继续提交任何文本而不显示错误。可能是什么问题呢?还是有替代方法?上面有人提到 并且有效,但它不是超级有效,因为它不检查“句号”。一定有办法吗?
  • 你添加jquery文件引用了吗?
  • 是的,我想,但是你能发布你的 jquery 文件引用的意思吗 - 也许我犯了一个错误。不知道为什么 jquery 不适合我。最初,我按照this tutorial 尝试了一个 jquery 验证插件,但它给出了不正确的错误,例如“请输入大于 0 的数字”用于电子邮件字段。但是对于一个简单的任务来说,插件似乎是不必要的,对吧?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-05-27
  • 2013-09-08
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-05-28
  • 2018-08-17
相关资源
最近更新 更多