我正在使用jquery帖子,不知何故,似乎帖子被发布了两次。我正在Android Broswer上测试这个。很有线。有人知道为什么吗?这是一个jquery bug还是什么?
<!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>
更多信息:
对原帖进行了一些更改。
实际上在Chrome中,我们首次发出请求时只发出了两个请求,一个是OPTION方法,另一个是POST。
但是在Android浏览器上,相同的代码每次都会发出两个POST请求。我认为使用Android浏览器的JQUERY可能有些问题。有谁知道这个吗?
答案 0 :(得分:2)
不确定为什么它会发布两次,但我注意到你的代码有几个问题。
首先,我们已经过了内联JavaScript并且在href
- 属性中执行JavaScript是一个很大的禁忌(这里有onclick
属性,但那是你应该做的另一个恐龙'触摸)。有很多优秀的JavaScript框架可以很容易地绑定到诸如click之类的事件。
其次,您的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)加载它。
我还建议您跳转到HTML5 doctype,它与HTML4向后兼容。只需将您的doctype切换为<!DOCTYPE html>
,就可以了。