加载一个感谢您弹出表单提交div提交

我想提交一个div加载，以感谢用户参加比赛。该div打开罚款，如果我添加像这样的href：<a href="#dialog" name="modal">click here"</a>

但是，我似乎无法使此弹出一次提交。难道我做错了什么！？

这是我的形式PHP代码：

<?php 
if($_POST['formSubmit'] == "Submit") 
{ 
    $errorMessage = ""; 

    if(empty($_POST['formName'])) 
    { 
    $errorMessage .= "<li>You forgot to enter your name</li>"; 
    } 
    if(empty($_POST['formTown'])) 
    { 
    $errorMessage .= "<li>You forgot to enter your town</li>"; 
    } 

    $varName = $_POST['formName']; 
    $varTown = $_POST['formTown']; 
    $varAge = $_POST['formAge']; 
    $varEmail = $_POST['formEmail']; 

    $varOne = $_POST['hidden-one']; 
    $varTwo = $_POST['hidden-two']; 
    $varThree = $_POST['hidden-three']; 
    $varFour = $_POST['hidden-four']; 
    $varFive = $_POST['hidden-five']; 

    if(empty($errorMessage)) 
    { 
     $fs = fopen("mydata.csv","a"); 
     fwrite($fs,$varName . ", " . $varTown . ", " . $varAge . ", " . $varEmail . ", " . $varOne . $varTwo . $varThree . $varFour . $varFive . "\n"); 
     fclose($fs); 

     header("Location: #dialog"); 
     exit; 
    } 
} 
?>

这是jQuery代码：

<script> 

$(document).ready(function() { 

    //select all the a tag with name equal to modal 
    $('a[name=modal]').click(function(e) { 
     //Cancel the link behavior 
     e.preventDefault(); 

     //Get the A tag 
     var id = $(this).attr('href'); 

     //Get the screen height and width 
     var maskHeight = $(document).height(); 
     var maskWidth = $(window).width(); 

     //Set heigth and width to mask to fill up the whole screen 
     $('#mask').css({'width':maskWidth,'height':maskHeight}); 

     //transition effect  
     $('#mask').fadeIn(1000);  
     $('#mask').fadeTo("slow",0.8); 

     //Get the window height and width 
     var winH = $(window).height(); 
     var winW = $(window).width(); 

     //Set the popup window to center 
     $(id).css('top', winH/2-$(id).height()/2); 
     $(id).css('left', winW/2-$(id).width()/2); 

     //transition effect 
     $(id).fadeIn(2000); 

    }); 

    //if close button is clicked 
    $('.window .close').click(function (e) { 
     //Cancel the link behavior 
     e.preventDefault(); 

     $('#mask').hide(); 
     $('.window').hide(); 
    });  

    //if mask is clicked 
    $('#mask').click(function() { 
     $(this).hide(); 
     $('.window').hide(); 
    });   

}); 

</script>

这是我的html：

<form action="enter.php" method="post" target="_self">  
    <input class="submit" type="submit" name="formSubmit" value="Submit"> 
</form> 


<div id="boxes"> 

<div id="dialog" class="window"> 
    <p>Modal content here</p> 
</div> 
</div> 

</div> 
</div> 

<!-- Mask to cover the whole screen --> 
<div id="mask"></div> 
</div>

来源

2011-10-10 kala233

听起来你可能会对你的网络浏览器和你的网络服务器之间发生的事情有些困惑。

您的网络浏览器正在运行呈现HTML/CSS并执行JavaScript的客户端。您的浏览器将向执行PHP的Web服务器提交请求以生成响应。

一旦您的表单被提交，就会向Web服务器发出请求，该服务器会生成响应 - 通常是另一个HTML页面。这是你的感谢信息应该在的地方。

来源

2011-10-10 16:11:45

不，不，我明白这一点。我只是觉得一个弹出式的谢谢div是最好的方法。 – kala233

如果你有一个提交按钮，不要调用preventdefault或类似的东西，你的表单被发布并刷新页面。所以你的js代码不再被执行。你需要做的是使用一个普通的按钮或链接，并绑定一个onclick事件，它首先显示谢谢你弹出，而不是“手动”通过JavaScript提交表单。

来源

2011-10-10 16:09:01

加载一个感谢您弹出表单提交div提交

回答

相关问题