0

我正在使用下面的代码自动提交表单而不刷新，但问题是当我在表单字段中使用手动提交按钮并提交它时工作正常但自动提交刷新。我想提交表单并将数据存储在 mysql 中。手动提交和自动提交数据正在存储，但页面通过我不想要的自动提交刷新

<script type="text/javascript">
window.onload = function() {
  setTimeout('document.form1.submit()',10000);
}
</script>

<script type="text/javascript" >
$(function() {
$(".button").click(function() {

var searchBox = $("#searchBox").val();
var dataString = 'searchBox='+ searchBox ;
if(searchBox=='')
{
   $('.success').fadeOut(200).hide();
   $('.error').fadeOut(200).show();
}
else
{
   $.ajax({
   type: "POST",
   url: "ytitest1.php",
   data: dataString,
   success: function(){
   $('.success').fadeIn(200).show();
   $('.error').fadeOut(200).hide();
}
});
}
return false;
});
});


 </script>

这是实时链接 http://way2enjoy.com/try/k/ytitest1.php

我只想自动提交，但页面不应该刷新

4

3 回答 3

0

这就是您所需要的，我已经包含了整个代码供您参考。

此示例将表单本身绑定到 ajax 调用，当它被调用时，表单操作什么都不做，只处理 jquery。适用于自动呼叫或手动呼叫。

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    </head>
    <body>
        <form id="myform" name="myform" action="#NULL" method="POST">
            <input type="text" name="myname">
            <input type="submit">
        </form>

        <script>
            $(document).ready(function() {
               setTimeout(function() {
                   $('#myform').submit();
               }, 1000);
               $('#myform').submit(function(e) {
                  e.preventDefault();
                  window.alert('Do work here.'); 
               }); 
            });
        </script>
    </body>
</html>

这是关于 jQuery .submit() 处理程序的文档：http: //api.jquery.com/submit/其中还包括有关 .preventDefault() 的信息。

于 2012-12-21T14:24:39.497 回答
0

你的 .click 函数应该有 e 参数然后添加

e.preventDefault();

在你的函数体中

$(function() {
$(".button").click(function(e) {
e.preventDefault(); 
var searchBox = $("#searchBox").val();
var dataString = 'searchBox='+ searchBox ;
if(searchBox=='')
{
   $('.success').fadeOut(200).hide();
   $('.error').fadeOut(200).show();
}
else
{
   $.ajax({
   type: "POST",
   url: "ytitest1.php",
   data: dataString,
   success: function(){
   $('.success').fadeIn(200).show();
   $('.error').fadeOut(200).hide();
}
});
}
});
});
于 2012-12-21T14:18:08.680 回答
0 
    <script type="text/javascript" >
    $(function() {
        $("form").submit(function() {
            var searchBox = $("#searchBox").val();
            var dataString = 'searchBox='+ searchBox ;
            if(searchBox=='')
            {
                $('.success').fadeOut(200).hide();
                $('.error').fadeOut(200).show();
            }
            else
            {
                $.ajax({
                    type: "POST",
                    url: "ytitest1.php",
                    data: dataString,
                    success: function(){
                        $('.success').fadeIn(200).show();
                        $('.error').fadeOut(200).hide();
                    }
                });
            }
            return false;
        });
    });
     </script>

当您自动提交表单时触发 onsubmit 事件，而不是点击

于 2012-12-21T14:21:22.707 回答