jquery发布两次?

jquery发布两次?

问题描述:

我正在使用jquery的帖子,不知何故,似乎该帖子发布两次。我正在Android Broswer上测试这个。非常有线。有人知道为什么吗?这是一个jQuery的bug或什么?jquery发布两次?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <script type="text/javascript" src="vendor/jquery-1.5.js"></script> 
    <title>Test Runners</title> 
</head> 
<body> 

<h1>Test Runner</h1> 
<script type="text/javascript"> 
    post_result = function() { 
     console.log("post_result is called!"); 
     $.post('http://192.168.2.3:8001', { 'jasmine-url' : "test url" ,'jasmine-content' : "test content" }) 
      .success(function() { alert("second success"); return true; }) 
      .error(function() { alert("error"); return true; }) 
      .complete(function() { alert("complete"); return true; }); 
    } 
</script> 
<a href="javascript:post_result()">post result</a> 
</body> 
</html> 

更多信息:

做了一些改动原来的职位。

实际上,在我们第一次发布post请求时,它只发出了两个请求,一个是OPTION方法,另一个是POST。

但是在Android浏览器中,每次同一个代码都会发两个POST请求。我认为使用Android浏览器的JQUERY可能存在问题。任何人都知道这一点?

+1

显示执行2个请求的Chrome开发人员工具的屏幕快照 – zerkms

+0

我最近遇到了一些问题(广泛报道),Chrome会令人惊讶地发出多个GET(空白'src'是一个示例),但从未使用POST。同意@zerkms,需要更多。 – Dan

不知道为什么它会发布两次,但我注意到与您的代码的几个问题。

首先,我们很早就通过内联JavaScript并在href内部执行JavaScript--属性是一个很大的不是的(这里有onclick属性,但那是另一个你不应该触摸的恐龙)。有很多优秀的JavaScript框架可以让它很容易绑定到事件上,比如点击。

其次,你的post_result函数被定义为全局的并且缺少分号。

要纠正上述情况,应在头部或单独的文件中放入以下片段。它也会做同样的事情,但采用更好的做法采用更加jQuery的方式。

的JavaScript

// Short-hand for DOM-ready 
$(function(){ 
    // Define variable in local scope to store request 
    var request; 

    // Bind to the click event to all anchors with the class post-results 
    $("a.post-results").click(function(e){ 
     // Prevent default behavior. I.e. stop browser from navigating 
     e.preventDefault(); 

     // If there's a previous request, abort it. No need for two. 
     // You could also return here if you want to wait for the first 
     // one to finish. 
     if (request) { request.abort(); } 

     // Let's fire off the request and store it for future reference 
     request = $.post(
       'http://192.168.2.3:8001', 
       { 
        "jasmine-url": "test url", 
        "jasmine-content": "test content" 
       } 
      ) 
      .success(function(res) { 
       console.log("second success", res); 
      }) 
      .error(function(xhr, err) { 
       console.log("error", err); 
      }) 
      .complete(function() { 
       console.log("complete"); 
       // Set request var to null 
       request = null; 
      }); 
    }); 
}); 

HTML

<a class="post-results" href="#">Post result</a> 

为了确保jQuery是正确加载,你应该从建立公共CDN加载它如Google Libraries API

我也催促你跳转到向后兼容HTML4的HTML5文档类型。只需将您的文档类型切换为<!DOCTYPE html>即可。

+0

非常感谢Marcus! – dongshengcn

+0

我不同意'onclick'。特别是,有一些jQuery UI插件基本上以一种绑定到原始文件的方式重写了一些DOM元素,但是“onclick”仍然有效。 – Dan