jQuery - 数据提交(表单与Ajax发布)

时间:2014-03-07 13:58:24

标签: jquery post form-submit

我对其他开发者意见和关于发布数据的想法感兴趣:

原生HTML:<form action="" method="POST">

vs

jQuery:jquery.post()$.ajax()

目前,我出于不同的原因使用两者,而且就我个人而言,我都喜欢这两种方式。

在随机的场合,我注意到了jQuery路线的细微差别,这就是为什么我在寻找意见。

我会尽力解释我在做什么。 但基本上(在特定表单页面上)我使用<form>禁用jQuery提交,并在不重新加载浏览器的情况下发布表单数据。

有时像这样:

simple_form.php

<form class="checkMyForm" id="myemailFORM">
  <input name="email1" type="text" value="blah@blah.yo" />
  <input name="email2" type="text" value="blah@blah.ma" />
  <input type="submit" name="button" value="submit" />
</form>

<script language="javascript" type="text/javascript">
$(document).ready(function(){

   $("form.checkMyForm").on('submit', function(){
      // do some stuff here (validation, clean-ups, who knows what else....)
      // stop if problems are detected:
      return false;

      // if good to go, use ajax(), for this page:
      var formid = $(this).attr("id");  // #myemailFORM 
      var formvaluesSerialized = $(this).serialize(); // key=val&key=val

      $.ajax({ 
         url:"simple_form.php", // stay on current page (php code is listening)
         data:"formid="+formid+"&"+formvaluesSerialized,
         type:"POST",
         cache:false,
         error:function(x,t,m){ /* alerts, logs, maybe freak out here  */ },
         success:function(response){

             /* do stuff here, and never redirect 
                use the "response" for any reason I'd like
             */

         }

      }); //eof ajax()

      return false; // ensure the html form still does not submit
   }); //eof on()

}); 
</script>

上面的代码对我很有用,99.99%的时间没有问题。

然后,随机地显示jQuery没有收听,我正常体验<form>提交。

奇怪的是,我会看到浏览器地址栏显示如下:

http://myurl.com/simple_form.php?formid=myemailFORM&email1=blah@blah.yo&email2=blah@blah.ma

我只需更改网址: [http://myurl.com/simple_form.php] ,然后重新提交,jQuery不会重新加载浏览器,发布数据,一切都很好。 (所以它是随机的和稀疏的)

这是否会发生在任何人身上? 或者说浏览器有时会使用JavaScript自行绊倒是否安全?

想法?

1 个答案:

答案 0 :(得分:2)

通常,只要我们需要将客户端提交的数据传递给服务器,就会使用$_POST方法,之后我们要向客户端(或完全不同的页面)提供更新的页面。服务器处理数据。

对于AJAX,它通常在我们希望客户端将一些数据传递到服务器同时将客户端保持在同一页面上并在服务器响应时仅更新该页面的一部分时使用。

在您的情况下,根据您的网址:

http://myurl.com/simple_form.php?formid=myemailFORM&email1=blah@blah.yo&email2=blah@blah.ma

提交了$_GET请求 - 通常在我们希望客户端从服务器请求某些数据时使用。除了$_GET请求之外,您可以告知$_POST个请求,因为在使用?...&...&...时,网址会$_GET构成{。}}。

也许在您看到此$_GET请求的情况下,您将表单方法指定为GET:

<form class="checkMyForm" id="myemailFORM" method="GET">
相关问题