javascript 提交后隐藏表单
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17539151/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Hide Form After Submit
提问by qweqweqwe
I am attempting to hide my form after my submit button has been pressed using Jquery.
我试图在使用 Jquery 按下提交按钮后隐藏我的表单。
So far I have imported the Jquery library.
到目前为止,我已经导入了 Jquery 库。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
Trying to attempt to hide the form using the class "form-fields." This class holds the whole form.
试图尝试使用“表单字段”类隐藏表单。这个类包含整个表单。
Trying to hide it like this:
试图像这样隐藏它:
<?php if (isset($_POST['process']) && ($_POST['process'] == 1)): ?>
<script type="text/Javascript">
$('#form-fields').hide();
</script>
This doesn't seem to be working. Any help would be appreciated.
这似乎不起作用。任何帮助,将不胜感激。
回答by Arun P Johny
You need to hide the form using the submit event handler and need to remove the PHP condition <?php if (isset($_POST['process']) && ($_POST['process'] == 1)): ?>
since it runs in the server side
您需要使用提交事件处理程序隐藏表单,并且需要删除 PHP 条件,<?php if (isset($_POST['process']) && ($_POST['process'] == 1)): ?>
因为它在服务器端运行
What happens below is, we register an event handler which will get called when the form is submitted, and inside that the form is hidden
下面发生的事情是,我们注册了一个事件处理程序,它会在提交表单时被调用,并且在其中隐藏表单
<script type="text/Javascript">
$('#form-fields').submit(function(){
$(this).hide();
})
</script>
回答by Dan Fox
If the form sends users to the same pageafter clicking submit, it's probably easiest to do the hiding with php. Add this somewhere at the top of your file:
如果表单在单击提交后将用户发送到同一页面,则使用 php 进行隐藏可能最容易。将此添加到文件顶部的某处:
<?php $submitPressed = isset($_POST['process'] && $_POST['process'] == 1; ?>
You can then wrap anything you want to hide in the following tags:
然后,您可以将要隐藏的任何内容包装在以下标签中:
<?php if (!$submitPressed): ?>
<!-- form goes here -->
<?php endif; ?>
Note, this will only hide the form once the server has been notified; there might be a tiny delay after pressing submit.
请注意,这只会在服务器收到通知后隐藏表单;按下提交后可能会有一点延迟。
Otherwise, you'll want to use some jQuery bound to the submit event.
否则,您将需要使用一些绑定到提交事件的 jQuery。
回答by Ohgodwhy
$('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
});
Same page...
同一页...
<?php
if(isset($_POST['process']) && ($_POST['process'] == 1)):
// do whatever processing
return true; //at the end so we can compare in ajax
endif;
?>
回答by VJPB
You can add the css property of that element to hidden on click..
$(function(){
$('form-fields').submit(function(){
$(this).css("visibility", hidden);
});
});