Javascript / css / php / mysql在网站上的div中收集用户电子邮件地址[关闭]

Posted 2023-02-25

技术标签:

【中文标题】Javascript / css / php / mysql在网站上的div中收集用户电子邮件地址[关闭]【英文标题】：Javascript/css/php/mysql to collect user email addresses in a div on a website [closed] 【发布时间】：2010-10-16 12:30:51 【问题描述】：

假设您想要在您的网站上显示“给我们您的电子邮件地址，我们会向您发送新闻”或类似内容的框。收集这些电子邮件地址的简单/优雅的方法是什么（假设是标准的 LAMP 堆栈）？特别是，我想要关于

的建议

javascript

php

或者，如果有一种花哨的 Rails 或 AJAX 方法可以做到这一点，我也很愿意接受。

（我目前所知道的只是如何使用老式 CGI 方式执行此操作，使用带有提交按钮的纯 html Web 表单和获取表单内容、提取电子邮件地址并吐出的服务器端脚本out html（可能重定向回原始页面）。）

如果我天真地认为我可以为此从现成的东西中获取一些东西，并且应该从 AJAX 教程之类的东西开始，也请告诉我。我看过this JQuery/AJAX tutorial 推荐。这是启动和运行简单注册表单的最快方法吗？

【问题讨论】：

【参考方案1】：

这是一个可以验证 99% 的电子邮件的正则表达式

/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]0,66)\.([a-z]2,6(?:\.[a-z]2)?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]2\.|[0-9]1,2\.))((25[0-5]|2[0-4][0-9]|1[0-9]2|[0-9]1,2)\.)2(25[0-5]|2[0-4][0-9]|1[0-9]2|[0-9]1,2)\]?$)/i

它看起来有点神秘，但它确实有效！正如cmets中所说的Damovisa，使用PHP的filter_var($email, FILTER_VALIDATE_EMAIL)函数更容易。

请注意，如果您在将电子邮件发送到 PHP 之前对其进行验证（以进行超快速验证），则需要使用正则表达式，因为 JavaScript 中没有内置函数可以为您执行此操作。

如果您使用 AJAX，您应该使用 JSON 让它返回成功或错误报告。

jQuery 库可以在使用 AJAX 时为您提供很多帮助，但了解它的工作原理仍然很重要。

【讨论】：

我猜不赞成票与我的正则表达式有关，有些人可能认为它太长且过于隐晦？不是我写的。可能是因为 php 中的 filter_var($q, FILTER_VALIDATE_EMAIL) 更容易？请记住，使用正则表达式意味着您现在有两个问题 (codinghorror.com/blog/archives/001016.html) :) 如果您还没有工作正则表达式，则只有 2 个问题。我会更新我的答案。谢谢。哇，正是我需要的 alex，谢谢！【参考方案2】：

奇怪的是，我刚刚在我的一个网站上实现了类似的东西。不过，我没有存储电子邮件地址，而是通过电子邮件将它们发送给自己。我将注释掉，以便您编写平面文件或数据库存储位。

这是我的实现，使用jQuery。偷走:)

在 HTML 中：

<script type="text/javascript">
    $(document).ready(function()
    $('#btnSubmit').click(function()
    $('#btnSubmit').disabled = true;
    var val = $('#emailAddress')[0].value;
    $('#emailResponse').html('<img src="ajax-loader.gif" border="0" />').css('backgroundColor', 'ffffd0');
    $.getJSON('notify.php',email: val, function(data)
        if (!data.result) 
            $('#emailResponse').html(data.message).css('backgroundColor','ff9999').effect('highlight', color: '#ffff99', 1000);
         else 
            $('#emailResponse').html(data.message).css('backgroundColor','99ff99').effect('highlight', color: '#ffff99', 1000);
        
        );
            $('#btnSubmit').disabled = false;
            return false;
    );
$('#emailAddress').keyup(function(e) 
    if(e.keyCode == 13) 
        $('#btnSubmit').click();
    
    return false;
);
);

</script>

</head>
<body>
    <div style="margin:0 auto;background:#ffffd0;width:500px;padding:10px;text-align:center; font-family:Verdana,Arial,sans-serif; border:1px solid black;">
    If you would like to be notified when we launch, please leave your email address here.<br /><br />
    <input type="text" id="emailAddress" size="40" style="border:1px solid gray;padding:5px;"/>
    <input type="button" id="btnSubmit" value="Submit" style="padding:5px;" />
    <div style="padding:10px;margin:10px;" id="emailResponse"></div>
</div>
</body>

在 notify.php 文件中：

<?php
$q = html_entity_decode($_GET["email"]);

$response = array();

if (!filter_var($q, FILTER_VALIDATE_EMAIL))

    $response['result'] = 0;
    $response['message'] = 'Invalid email given - try again';

else

    // write to file or database

    $response['result'] = 1;
    $response['message'] = "Thanks, your details have been added, we'll notify you when we launch!";
    


echo json_encode($response);
?>

编辑：我知道它不漂亮 - 内联样式、<br/> 标签等。

【讨论】：

+1 对他来说是一个很好的起点...剖析一下，按照我的 JSON 链接了解为什么 PHP 会回显（）它是什么。绝对 - 亚历克斯的好点，不要盲目地剪切和粘贴 - 确保你理解它想要做什么。下次肯定对你有帮助。非常感谢！我正在使用问题中链接的教程将它拼凑在一起，但是很高兴看到它们像这样放在一起。非常有帮助。我几乎一字不差地偷了它（并非完全盲目！），将电子邮件地址附加到一个平面文件中。 centmail.net【参考方案3】：

我不认为你会找到类似“包含它，一切都会神奇地工作”之类的东西，但你可以使用标准的 LAMP + jQuery 实现立即准备好它：

UI：使用正则表达式可以轻松验证电子邮件。谷歌，你会发现大量的脚本。 AJAX：jQuery AJAX 方法很棒，所以我建议这样做。使用 PHP 很容易获取您的 AJAX 参数并插入到数据库中。

【讨论】：

【参考方案4】：

如果唯一的功能是让用户输入电子邮件地址，我认为没有理由打扰 AJAX。页面刷新不会破坏用户的工作流程。坚持使用普通的老式 CGI 方法。

【讨论】：

+1 ...请不要为了AJAX而使用它。我在一定程度上同意 - 如果 AJAX 适合您的网站设计和行为，我会说使用它。并非一切都需要纯粹与功能有关 - 如果是的话，我们会有一些非常丑陋的网站。功能没有有丑...否则谷歌会丑得要命:)你甚至可以争辩说功能允许美丽，但美丽不会必须允许功能

以上是关于Javascript / css / php / mysql在网站上的div中收集用户电子邮件地址[关闭]的主要内容，如果未能解决你的问题，请参考以下文章

程序员日常 | HTML+CSS+JavaScript+PHP

php CSS和Javascript缓存破坏

WooCommerce- 画布/绘画的 SizeInfo 按钮。 [PHP,Javascript,html,css]

用于 Web 开发和设计的有用 Vim 插件（php、html、css、javascript）？ [关闭]

如何在 wordpress 页面上包含带有自己的 css 和 javascript 的 php 页面？ [关闭]

PHP 压缩gzip中的Javascript或CSS文件