Colorbox + Form，仅提交工作按Enter键（不是onclick）

I integrated a popup upon landing on our page http://www.showstye.lu (best seen in an incognito window due to cookie reset). In this popup you have a newsletter signup form which is a copy of the one available in the footer.

我在登录页面http://www.showstye.lu时整合了一个弹出窗口(由于cookie重置,最好在隐身窗口中看到)。在此弹出窗口中,您有一个简报注册表单,该表单是页脚中可用的表单的副本。

I had to duplicate css to adapt to the newsletter popup so that it styled correctly which is fine, I am using Colorbox for the popup itself.

我不得不复制css以适应时事通讯弹出窗口,以便正确设置样式,这很好,我使用Colorbox作为弹出窗口本身。

Now, the form itself when I click on the submit button (S'Abonner) it doesn't trigger the submit correctly. I always get a false return telling me to resubmit a new e-mail address.

现在,当我点击提交按钮(S'Abonner)时,表单本身并没有正确触发提交。我总是得到一个错误的回复告诉我重新提交一个新的电子邮件地址。

However, the newsletter form itself works completely fine in the footer and ALSO when I use the keyboard stroke "Enter" instead of clicking on the submit button.

但是,当我使用键盘笔划“Enter”而不是单击提交按钮时,简报形式本身在页脚中完全正常工作。

I don't comprehend why one form works in the footer but the identical copy does not (only with Enter keystroke), I looked at the styling/JS/html of the form and it is identical across both.

我不理解为什么一个表单在页脚中起作用但相同的副本不起作用(仅使用Enter键击),我查看了表单的样式/ JS / html,两者都是相同的。

Any ideas how to resolve this so that the submit button works successfully?

任何想法如何解决这个问题,以便提交按钮成功运作?

<div style='display:none'>
<div id='subscribe_popup'>
<div id="spop_left">
    <div id="spop_top"></div>
    <div id="spop_sign">
        <div class="popbox">
          {% if theme.setting_newsletter %}
                <form id="formNewsletter" action="{{ 'account/newsletter' | url }}" method="post">
                <input type="hidden" name="key" value="{{ page.key }}" />
                <input type="email" name="email" id="formNewsletterEmail" value="" placeholder="{{ 'E-mail' | t }}"/>
                  <a class="btn glyphicon glyphicon-send" href="#" onclick="$('#formNewsletter').submit(); return false;" title="{{ 'Subscribe' | t }}" {% if shop.language == 'de' %}style="padding: 0px 10px;"{% endif %}><span>{{ 'Subscribe' | t }}</span></a>
              </form>
        </div> {% endif %}
     </div>
     </div>
    <div id="spop_right"></div>


   </div>
   </div> 
  <!-- END subscribe popup-->

Here is the JS behind it:

这是它背后的JS:

    <script> // popup script 
    $("document").ready(function (){ 
   // load the overlay
    if (document.cookie.indexOf('visited=true') == -1) {
  var fifteenDays = 1000*60*60*24*15;
  var expires = new Date((new Date()).valueOf() + fifteenDays);
  document.cookie = "visited=true;expires=" + expires.toUTCString();
  $.colorbox({width:"553px", inline:true, href:"#subscribe_popup"});
}
  $(".open_popup").colorbox({width:"553px", inline:true, href:"#subscribe_popup"});

     });
    </script>

1 个解决方案

#1

Ok that was it, I was integrating a submit into the hyperlink instead of using a simple inputtype submit, keystroke was obviously working because of how the browser automatically identifies the keystroke enter as a submit!

好吧就是这样,我正在将提交集成到超链接而不是使用简单的inputtype提交,按键显然是有效的,因为浏览器如何自动识别按键输入作为提交!