将日期从 html 表单发送到 Google 日历等答案

【问题标题】：Send date from html form to Google calendar, etc将日期从 html 表单发送到 Google 日历等
【发布时间】：2021-01-04 18:57:23
【问题描述】：

这是一个菜鸟问题。我想做的是建立一个生日聚会预订网站，让人们填写表格：是/否将参加，姓名，电子邮件。填写“将参加”的表格后，我希望有一个弹出模式，可以选择“添加到您的日历：Google、iCal 等”。这可能以 html 形式（javascript/ajax）吗？我知道它可以在 WordPress 中完成。感谢您的任何帮助/建议。

【问题讨论】：

是的，这是可能的。然而，这个问题太模糊了。除非你想让别人为你写这整件事。这是您想要查看的一种来源：developers.google.com/calendar
谢谢。我会看那些文档。不，我不想让别人写它；我想学习如何。
我从这个网站得到了这个想法。这是一场婚礼，但我想我可以在家庭生日派对上使用相同的概念。 berichinlove.com。密码：04092016

标签： javascript html forms

【解决方案1】：

这是一个关于你可以做什么的非常基本的想法。我使用此处的答案将表单放入控制台：https://stackoverflow.com/a/47188324/12946266 您很可能需要使用 php 来操作此表单，但我不能在这里使用。

const form = document.querySelector('form');
document.getElementById("myForm").addEventListener("submit", function(event) {
  event.preventDefault();
  var values = Object.values(form).reduce((obj, field) => {
    if(field.type=='radio'){
     obj[field.name] = field.checked;
    }else{
      obj[field.name] = field.value;
    }
    return obj
  }, {})
  console.log(values);
});

<form id="myForm" action="/action_page.php">
  First name: <input type="text" name="fname" value=""><br> Last name: <input type="text" name="lname" value=""><br> email: <input type="text" name="email" value=""><br>
  <input type="radio" id="attending" name="attendance" value="attending">
  <label for="attending">attending</label>
  <br>
  <input type="submit" value="Submit"><br>
</form>

【讨论】：