簡單的表單不工作jQuery覆蓋

Question

我想在我的網站上設置一個彈出，這將允許用戶訂閱我的電子郵件列表，表單工作正常，當它在頁面（不在彈出窗口內）。但只要我把它放入我的jQuery覆蓋（在X秒後出現），表單不起作用。

HTML

<div class="main-content"> 
<p>Please <a class="show-popup" href="#">click here</a> to see the popup</p> 
</div> 

<div class="overlay-bg"> 
<div class="overlay-content"> 
<form action="http://wrd.createsend.com/t/y/s/qljjjl/" method="post" class="basic-grey" id="subform"> 
    <h1>Subscribe 
     <span>Sign up for our FREE monthly newsletter to stay up to date with the latest digital news, views and articles</span> 
    </h1> 
    <label for="fieldName"> 
     <span>Your Name:</span> 
     <input id="fieldName" type="text" name="cm-name" placeholder="Your Full Name" /> 
    </label> 
    <label for="fieldEmail"> 
     <span>Your Email:</span> 
     <input id="fieldEmail" type="email" name="cm-qljjjl-qljjjl" placeholder="Valid Email Address" /> 
    </label> 
    <label> 
     <span>&nbsp;</span> 
     <button type="submit" class="button" form="subform">Subscribe</button> 
    </label>  
</form> 


</div> 
</div> 

JS

<script> 
$(document).ready(function(){ 
// show popup when you click on the link 
$('.show-popup').click(function(event){ 
event.preventDefault(); // disable normal link function so that it doesn't refresh the page 
$('.overlay-bg').show(); //display your popup 
}); 

// hide popup when user clicks on close button 
$('.close-btn').click(function(){ 
$('.overlay-bg').hide(); // hide the overlay 
}); 

// hides the popup if user clicks anywhere outside the container 
$('.overlay-bg').click(function(){ 
    $('.overlay-bg').hide(); 
}) 
// prevents the overlay from closing if user clicks inside the popup overlay 
$('.overlay-content').click(function(){ 
    return false; 
}); 

}); 
</script> 

     <script type="text/javascript">           
     $(document).ready(function() { 

     function showpanel() { 
      if($.cookie('showOnlyOne')){ 
       //it is still within the day 
       //hide the div 
       $('#shownOnlyOnceADay').hide(); 
      } else { 
       //either cookie already expired, or user never visit the site 
       //create the cookie 
       $.cookie('showOnlyOne', 'showOnlyOne', { expires: 10 }); 

       //and display the div 
       $('.overlay-bg').fadeIn('slow'); // this will fade in the popup 
}} 

setTimeout(showpanel, 3000) 
     }); 
     </script> 

正如你可以從上面的代碼告訴，我還計劃在顯示彈出當有人點擊一個鏈接。

您可以檢出它（不工作）演示在這裏 - 如果你等待5秒鐘彈出會顯示：

http://thiswebguy.com/testing/

Answer 1

也在努力：

$('.button').click(function(e) { e.stopPropagation(); }); 

Answer 2

行

$('.overlay-content').click(function(){ 
    return false; 
}); 

從停止形式註冊提交點擊。

變化的功能，使得它要麼不包括提交按鈕

$('.overlay-content :not(:submit)').click(etc...) 

或使用event.srcElement通過添加返回true

$('.overlay-content').click(function(e){ 
if($(e.srcElement).is(':submit')) 
     return true; 
else return false; 
    });