在 jQuery 中提交表单后，在 PHP 中完成

Question

我有一个 php 文件，它包含一个文本文件和提交按钮以及一个 div，下面是代码

Page1.php

<form name="form1" method="post">
  <input type="text" name="email1">
  <input type="submit" name="submit" value="send" class="submit_class">

  <div class="suc_box">You have Entered</div>
</form>

if($_POST['submit']) {
  $v1 = $_POST['email1'];

  // $query1 =  here some code to insert into database

  if($query1 > 0){
    //here i want to display the div `suc_box`.. Here how i can show that div
  }
}

和 jQuery 代码：

$(document).ready(function(){
    $('suc_box').hide();

    $('suc_box').click(function(){
        $(this).hide();
    });
});   

问题：当表单提交后，如何显示/显示 suc_box它插入数据库了吗？

Answer 1

您可以使用 AJAX 轻松完成。您有一个带有表单的 php 文件，另一个用于处理数据：

//form_file.php

<form id="my_form" onsubmit="validateform();">
  <input type="text" name="email1" />
  <input type="submit" value="OK" />
</form>

<div class="suc_box"></div>

<script>
$(document).ready(function(){
  $('.suc_box').click(function(){
    $(this).hide();
  });

  $('#my_form').submit(function(){
    var data = $(this).serialize();
    $.post('process.php',data,function(return_data){
      $('.suc_box').html(return_data);          
    });
    return false; //cancel the 'real' submit
  });
});   
</script>

//process.php

<?php
$email = mysql_real_escape_string($_POST['email1']);
//write data to DB
if($succeeded) {
  echo 'You have Entered';
} else {
  echo 'Something went wrong, try again!';
}

它未经测试，但您已经明白了。

验证电子邮件字段

    function validateform(){
        if (!/^\S+@\S+\.\w+$/.test(document.sweetform.Email.value)) {
            alert("Not a valid e-mail address");
            return false;
        }
        else {
            return true;
        }

    }

Answer 2

如果我猜对了，你可以这样做，但我建议你研究一下 ajax 来做你想做的事

    <div class="suc_box">
         You have Entered
    </div>
    </form>
    <?php  
    if($_POST['submit'])
    {
     $v1 = $_POST['email1'];

     // $query1 =  here some code to insert into database

      if($query1 > 0){
       ?>


       <script type="text/javascript">
          $('suc_box').show();

       </script>
<?php
    }

    }
?>