解决方案不起作用
在浪费了一整天学习前端Web开发之后,我将进度条放入在jquery对话框中启动的iframe中,期望ajax get请求从该页面开始工作。不幸的是,我收到了完全相同的行为。
发现问题
按继续时,会提交表单。只要完成此操作并将请求发送到服务器,它就会阻止所有其他ajax调用工作。看起来像webkit中的一个错误,目前没有建议的解决方案:
https://bugs.webkit.org/show_bug.cgi?id=23933
我有以下代码:
$(document).everyTime("3s", function() {
$.get('uploadProgressServlet.jsp', {queue : 'parse'}, function(data){
<!-- Do something -->
}
});
这在ie和firefox中运行良好,但是当我在chrome中调试时,我点击$ .get方法但从未使用内部函数,然后当我查看get选项卡时,我看不到任何httprequest被发送到服务器。您应该知道我不是前端Web开发人员,因此可能会遗漏一些非常明显的内容。
修改
所以这是我的所有代码。看起来一切都表现得应该如此,但是一旦我撤消对$('continue')的评论。点击......我只看到对话框出现而没有任何请求被发送到服务器而控制台中没有错误。
var lock = false;
var processing = false;
//$('#continue').click(function(){
$('#dialog').dialog({
modal : true,
closeOnEscape : false,
open: function() {
$('#queueDiv').hide();
$('#progressDiv').hide();
$(".ui-dialog-titlebar-close").hide();
//Poll place in the queue every seconds
$(document).everyTime("1s", function() {
if(!lock) {
lock = true;
if(!processing) {
$.get('uploadProgressServlet.jsp', {queue : 'parse'}, function(data){
$('#queueDiv').show();
$('#queuePlace').replaceWith(data);
if(data <= 0) {
processing = true;
$('#queueDiv').hide();
$('#progressDiv').show();
$('#progressBar').progressbar({
value: 0
});
}
});
}
else {
$.get('uploadProgressServlet.jsp', {process : 'parse'}, function(data){
$('#progressBar').progressbar({
value: parseInt(data == -1 ? 0 : data)
});
});
}
lock = false;
}
});
}});
});
//});
因此,如果没有激活click方法,则会向服务器发送一个请求,并收到一个响应,说明进程是否在队列中。当确定不在队列中时,会出现一个进度条的动画,该动画会根据完成的百分比来轮询后端的进度增量。
当点击处于活动状态时,在其调用时会出现一个没有内容的对话框,调试后端会显示已再接收到新请求。控制台中没有错误。
修改
原来这是webkit的一个问题,而不是特别是chrome。