表单提交被取消,因为当我尝试隐藏模式Jquery时未连接表单

时间:2019-03-22 16:37:58

标签: javascript jquery submit form-submit submit-button

我目前正在尝试提交表单,并在提交后隐藏模式。

HTML

<div class="overlay">
 <div id="popMainWrpDiv">
  <div id="closeBtn"><img src="close button img" /></div>

  <div id="headCont">
  <h1>Let&rsquo;s get you started!</h1>

  <h2>Please enter your email address here:</h2>
</div>

<p>You&rsquo;ll also receive a subscription to our free e-letter: <em>Health Watch</em>!</p>
<form id="myForm" align="center" action="https://signupapp2.com/signupapp/signups/process" method="post">
  <input name="signup.listCode" type="hidden" value="Blah Blah" />
  <input name="signup.sourceId" type="hidden" value="Blah Blah" />
  <input id="emailField" placeholder="Enter your email address" type="text" name="signup.emailAddress" />
  <input class="submit-gen" type="submit" value="Click to Proceed"id="emailCaptureButton"></input>
</form>

jQuery脚本

<script>
 $(window).load(function() {
  if (!localStorage.getItem("emailCapture")) {

  $('.overlay').show();
}
$('.subscribeNow').click(function() {
  $('.overlay').show();
});
$('#closeBtn').click(function() {
  $('#popMainWrpDiv').hide();
  $('#popMainWrpDiv').remove();
  $('.overlay').hide();
  $('.overlay').remove();
});



$("#myForm").submit(function() {
  console.log('WTF');
  $(this).hide();
  $(this).remove();
  $('.overlay').hide();
  $('.overlay').remove();
 })
});
</script>

我尝试了所有操作,从删除类到隐藏类,从按钮切换为使用type =“ submit”输入。我仍然收到相同的“由于未连接表单而取消了表单提交”错误。但是,如果我不隐藏它,则表单会通过但页面会重定向,但表单会转到后端。我尝试了eventpreventdefault,但随后测试电子邮件将不会显示在数据库中。我只是不确定我还尝试了其他所有尝试方法。最后,抱歉,过时的代码是从一位前同事那里传给我的

1 个答案:

答案 0 :(得分:0)

我发现解决方案是使表单目标成为虚拟iframe,并在那里重定向表单过程。这是对我有帮助的页面

How to submit html form without redirection?