Javascript 使用GitHub页面从引导模板获取联系人表单

我在GitHub页面上制作联系人表单时遇到了问题，因为它们提供静态网站，或者我听说过。我一直在尝试使用Formspree，因为它在其他StackOverflow问题中也提到过同样的问题，我也读过这篇文章。以下是我目前从Boostrap代理模板中获得的HTML/JS代码：

$（函数（）{
$（“#contactForm输入，#contactForm文本区域”）.jqBootstrapValidation({
对,，
submitError：函数（$form、event、errors）{
//其他错误消息或事件
},
submitSuccess：函数（$form，event）{
event.preventDefault（）；//防止默认提交行为
//从表单中获取值
变量名称=$（“输入名称”）.val（）；
var email=$（“输入电子邮件”）.val（）；
var phone=$（“输入电话”）.val（）；
var message=$（“textarea#message”）.val（）；
var firstName=name；//对于成功/失败消息
//检查名称中是否有空格以显示成功/失败消息
if（firstName.indexOf（“”）>=0）{
firstName=name.split（“”）.slice（0，-1）.join（“”）；
}
$.ajax({
url:“.//邮件/联系_me.php”，
类型：“POST”，
数据：{
姓名:姓名,，
电话:电话,，
电邮:电邮,，
信息：信息
},
cache:false，
成功：函数（）{
//成功信息
$（'#success'）.html（“”）；
$（'#success>.alert success'）.html（“×；”）
.附加（“”）；
$（“#success>.alert success”）
.append（“您的邮件已发送。”；
$（“#success>.alert success”）
.附加（“”）；
//清除所有字段
$（'#contactForm'）。触发器（“重置”）；
},
错误：函数（）{
//失败消息
$（'#success'）.html（“”）；
$（'#success>.alert danger'）.html（“×；”）
.附加（“”）；
$（“#success>.alert danger”）.append（$（“”）.text（“对不起”+firstName+”，我的邮件服务器似乎没有响应。请稍后再试！”）；
$（“#success>.alert danger”）.append（“”）；
//清除所有字段
$（'#contactForm'）。触发器（“重置”）；
},
});
},
过滤器：函数（）{
return$（this）.is（“：可见”）；
},
});
$（“a[数据切换=\”选项卡\“]）。单击（函数（e）{
e、 预防默认值（）；
$（此）.tab（“显示”）；
});
});
/*单击完全隐藏失败/成功框时*/
$（'#name'）。焦点（函数（）{
$（'#success'）.html（''）；
});





发送消息
我看到这是一篇旧文章，但昨天也遇到了同样的问题。看看你的代码，JS和PHP似乎仍在控制之中，不允许formspree完成它的工作

在Codepen上的这篇文章的帮助下，我可以得到一个表格

我使用这些信息修改了我的表单页面（修改仅针对HTML，我可以删除JS和PHP），但保留了原始样式。以下是我的示例：

    <div class="container">
    <h2 class="text-center">Let's work together</h2>
    <hr>
      <div class="container">
        <div class="row">
          <div class="col-lg-8 mx-auto">
            <form action="https://formspree.io/you@your.com" role="form"   method="POST" autocomplete="on">
              <div class="control-group">
                <div class="form-group floating-label-form-group controls">
                  <input type="text" class="form-control" name="name" placeholder="Name" required>
                </div>
              </div>

              <div class="control-group">
                <div class="form-group floating-label-form-group controls">
                  <input type="email" class="form-control form-input" placeholder="Email" required>
                </div>
              </div>

              <div class="control-group">
                <div class="form-group floating-label-form-group controls">
                  <textarea class="form-control" id="message" name="message" rows="5" width="100%" placeholder="Tell me about your project" required></textarea>
                </div>
              </div>
              <br>
                <div>
                  <!-- Extra field to avoid spam by fooling scrapers. If a value is provided, the submission will be silently ignored. -->
                  <input type="text" name="_gotcha" style="display:none" />
                </div>
              <div>
                <input type="submit" class="btn btn-primary" value="Send">
                <input type="hidden" name="_subject" value="New submission!" />
              </div>
              <br>
            </form>
          </div>
        </div>
      </div>
    </div>
   </div>     
</section>


让我们一起工作






您可以修改它以供使用。关键部分是：

    <form action="https://formspree.io/bill@kearneybillt.com" role="form" method="POST" autocomplete="on">