Question

我试图在使用Jquery按下提交按钮后隐藏我的表单。

到目前为止，我已经导入了Jquery库。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

尝试使用“表单字段”类隐藏表单。这个课程保留了整个表格。

试图像这样隐藏它：

 <?php if (isset($_POST['process']) && ($_POST['process'] == 1)): ?>
<script type="text/Javascript">
    $('#form-fields').hide(); 
</script>

这似乎不起作用。任何帮助将不胜感激。

Answer 1

您需要使用提交事件处理程序隐藏表单，并且需要删除PHP条件<?php if (isset($_POST['process']) && ($_POST['process'] == 1)): ?>，因为它在服务器端运行

下面会发生什么，我们注册一个事件处理程序，它将在提交表单时调用，并在表单中隐藏

<script type="text/Javascript">
    $('#form-fields').submit(function(){
        $(this).hide(); 
    })
</script>

Answer 2

如果表单在单击提交后将用户发送到同一页面，则最简单的方法是使用php进行隐藏。将其添加到文件顶部的某处：

<?php $submitPressed = isset($_POST['process'] && $_POST['process'] == 1; ?>

然后，您可以将要隐藏的内容包装在以下标记中：

<?php if (!$submitPressed): ?>
<!-- form goes here -->
<?php endif; ?>

请注意，这只会在服务器通知后隐藏表单;按提交后可能会有一点延迟。

否则，您将需要使用绑定到提交事件的一些jQuery。

Answer 3

$('form-fields').submit(function(){
    var $this = $(this); // so we can use in ajax callback
    $.ajax({
        url: '/',
        data: $(this).serialize(),
        success: function(data){
            if(data == true){
               $this.hide(); //hide form if we got a true to return
            }
        }
    });
    return false; //stop default form submit
});

同一页......

<?php 
if(isset($_POST['process']) && ($_POST['process'] == 1)):
    // do whatever processing
    return true; //at the end so we can compare in ajax
endif;     
?>

Answer 4

You can add the css property of that element to hidden on click..


$(function(){
 $('form-fields').submit(function(){
     $(this).css("visibility", hidden);
  });
});

提交后隐藏表单

4 个答案: