-1

我是 HTML 新手,我正在尝试创建一些预填充的复选框项目(一些是自定义文本,即输入您自己的值的输入框),以便用户输入数据并检查列表。本质上,我正在创建类似于 TO-DO-LIST 的东西。

我不知道如何添加两件事:

  1. 用户能够保存表单、导航到其他地方并返回继续
  2. 用户能够以包含其复选框值的格式通过电子邮件发送完成的表单。

有人可以帮忙吗!

早间清单

早间清单

  • 醒来
  • 刷牙
  • 呜呜呜
  • 通过电子邮件发送

4

2 回答 2

1

在这里阅读http://www.w3schools.com/php/php_mail.asp。您需要一个 PHP 脚本。

于 2013-04-13T22:14:12.607 回答
0

只需一些 HTML 和 JavaScript 即可完成您的任务。jQuerySisyphus JavaScript 库在这里为您提供帮助。使用普通的 html/javascript 发送邮件非常容易。

我将一些示例 HTML 放在一起(它比我想象的要广泛一些,但你已经有了):

<!DOCTYPE html>
<html>
  <head>
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.js'></script>
    <script type='text/javascript' src='http://sisyphus-js.herokuapp.com/assets/application-09059f9f54cc3c3bff98487cf866644b.js'></script>
    <script type='text/javascript'>
      function sendMail() {
        var mailbody = "My Checklist: \n\n"
                       + $('input[type="checkbox"]').map(
                            function(id, box){ return (box.checked ? "[x]" : "[ ]") + " " + box.name;}
                          ).get().join("\n");
        var link = "mailto:me@example.com"
                    + "?cc=myCCaddress@example.com"
                    + "&subject=" + escape("This is my subject")
                    + "&body=" + escape(mailbody);
        window.location.href = link;
      }

      $(function(){
        $( "#checklist" ).sisyphus();
      });
    </script>
  </head>
  <body>
    <form id="checklist">
      <label><input type="checkbox" name="buy" />Buy some tee</label><br />
      <label><input type="checkbox" name="brew" />Brew the tee</label><br />
      <label><input type="checkbox" name="drink" />Drink tee</label><br />
      <button onclick="sendMail(); return false">Send Mail</button>
  </form>
  </body>
</html>

Sisyphus 是一个将表单数据保存在浏览器本地存储中的库。这样,您可以离开页面,稍后再回来,仍然保留您的表单值(如果您在同一台计算机上使用相同的浏览器返回)。

sendMail()函数构建了一个 mailto 链接,该链接打开您的本地电子邮件客户端,其中包含准备发送的新邮件。

编辑:缩短的示例代码

于 2013-04-14T10:32:54.590 回答