javascript - Formspree(HTML)和JavaScript无法同时使用。 (Toastr库)

当我将网站托管在静态页面上时，我正在使用Formspree-https://formspree.io/将表单重定向到我的电子邮件。

我还使用外部库Toastr（http://codeseven.github.io/toastr/）在用户单击表单的“提交”按钮后显示一条小通知。

问题是我无法让Formspree和Toastr同时运行。当我同时实现这两个功能时，所有功能都不起作用。

代码：（请说出是否需要添加更多内容以使问题更清楚）。

<form action="http://formspree.io/emailhere" method="POST">
       <div>
         <div class="row">
          <div class="6u 12u(mobile)">
         <input type="text" name="name" id="name" placeholder="Name" />
            </div>
               <div class="6u 12u(mobile)">
                  <input type="email" name="_replyto" id="email" placeholder="Your Email" />
             </div>
               </div>
              <div class="row">
                <div class="12u">
                 <input type="text" name="subject" id="subject" placeholder="Subject" />
                   </div>
                </div>
                 <div class="row">
                    <div class="12u">
                    <textarea name="message" id="message" placeholder="Message"></textarea>
                 </div>
              </div>
           <div class="row 200%">
            <div class="12u">
          <ul class="actions"> //Pressing submit redirects to a 'thank you' page
   <li> <input name="submit" type="submit" value="Send" id="submit"/> </li>
  <li> <input type="reset" value="Clear Form" class="alt" />  </li>
        </ul>
          </div>
           </div>
              </div>
                </form>

现在，当您按下提交按钮时，它会将您重定向到Formspring谢谢页面。当我为敬酒通知添加Javascript时，它甚至都没有这样做，这意味着JavaScript以某种方式“破坏”了提交按钮的功能。

     $(document).on('click', '#submit', function(evt){
    evt.preventDefault();
    toastr.success('Thanks for the email, will be in touch promptly.');
});

感谢您的光临。

编辑：所以我想要这样，以便他们两个一起工作。这是HTML的代码，您可以在按下“提交”按钮后选择重定向页面：

<input type="hidden" name="_next" value="//site.io/thanks.html" />

我想要它，所以它不会重定向到任何地方，但是会执行我的JS函数通知。

最佳答案

您正在防止点击处理程序中的默认行为（重定向到表单URL）。只需删除

evt.preventDefault();

并且它应该可以工作（尽管显然，由于您的页面已被重定向，因此Toastr弹出窗口将不可见）。

如果希望它在新选项卡中打开，则应避免默认行为（如您当前所做的那样），然后阻止open the URL manually。

关于javascript - Formspree(HTML)和JavaScript无法同时使用。 (Toastr库)，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/32531426/