JavaScript 似乎在 AJAX 调用后停止了
JavaScript Seems to Stop After AJAX Call
问题标题相当模糊,但这是我的情况。我有一个 Web 应用程序大约 700+ 行 jQuery,每个函数和代码中的"主要兴趣点"在触发时由控制台日志记录。例如,我有几个函数使用对 servlet 的 AJAX 调用来检索一些信息。我记录 AJAX 请求何时开始,如果成功(然后打印它收集的数据(等。因此,从打开页面时控制台记录的内容来看,它似乎在第一次 AJAX 调用后停止。当然,调用似乎工作得很好,它返回的数据是完美的。如您所见,它甚至按预期填充了选择框。但是,控制台日志不久后停止,使我相信由于某种原因,其他函数没有被调用......
jQuery
$(document).ready(function() {
Initialize();
});
function Initialize() {
console.log("Initializing...");
User();
Widgets();
if($.cookie("fogbugzId") != null) {
console.log("Stored ID: " + $.cookie("fogbugzId"));
$("#userSelect").val($.cookie("fogbugzId")).trigger("change");
$("#userSelect").hide();
} else console.log("No ID Stored!");
}
function User() {
console.log("Initializing User...");
$.each(FetchUsers(), function(index, user) {
$("#userSelect").append($("<option>").val(user.id).text(user.name));
});
$("#userSelect").change(function() {
if($("#userSelect").val() != "") {
console.log("User Changed to " + $("#userSelect").val() + ": " + $("#userSelect").text());
$.cookie("fogbugzId", $("#userSelect").val(), { expires: 365 });
}
Update();
});
console.log("User Initialized!");
}
function FetchUsers() {
console.log("Loading Users...");
$("#loading").show();
$.get(servlet, { command: "getUsers" }, function(data) {
var users = new Array();
$(data).find("user").each(function() {
users.push({
id: $(this).find("id").text(),
name: $(this).find("name").text()
});
});
$.each(users, function(index, user) {
console.log(">> " + user.id + ": " + user.name);
});
console.log("Users Loaded!");
return(users);
}, "xml").complete(function() {
$("#loading").hide();
}).error(function() {
console.log("Loading Users Failed!");
});
}
function Widgets() {
console.log("Initializing Widgets...");
// More Code
console.log("Widgets Initialized!");
}
安慰
Initializing...
Initializing User...
Loading Users...
>> 267: Alex Molthan
>> 35: Bill Brinkoetter
>> 100: Bob Yoder
>> 189: Brian Cutler
>> 559: Brian Ormond
>> 400: Corey Nakamura
Users Loaded!
但日志记录就停在那里。因此,从数据库中获取用户的 AJAX 调用工作正常,但显然 User()
函数无法正确完成。JavaScript 控制台给我的唯一错误是我的jquery.min.js
文件中的错误:
Uncaught TypeError: Cannot read property 'length' of undefined jquery.min.js:16
f.e.extend.each jquery.min.js:16
User modifytime.js:14
Initialize modifytime.js:3
(anonymous function) modifyTime.jsp:21
f.extend._Deferred.e.resolveWith jquery.min.js:16
f.e.extend.ready jquery.min.js:16
f.c.addEventListener.B jquery.min.js:16
看起来好像它在循环访问 FetchUsers()
函数返回的用户数组的$.each()
上中断。我知道该函数返回可用的数组,所以我不确定它卡在什么地方。谁能立即看到我错过的东西?我尝试先将 FetchUsers()
函数返回的users[]
分配给变量,然后将其传递给$.each()
,但它仍然不起作用。有什么建议吗?
编辑:用未压缩的版本替换jQuery的缩小版本后,似乎我传递给$.each()
函数的用户数组现在具有.length
属性,这就是它中断的原因。只是为了检查,在调用该特定$.each()
函数之前,我放置了从FetchUsers()
函数返回的users[].length
的日志,以查看它仍然没有.length
属性。然后,我转到FetchUsers()
函数本身,并在返回之前放置了users[].length
的日志。但是,此日志运行良好(尽管我的示例没有显示它,但它返回了 40 个用户(。那么我的users[]
不是作为数组或其他东西返回吗?
FetchUsers
不返回任何内容,它甚至没有返回语句。此外,$.get 是一个异步函数,因此不能将它从 FetchUsers
函数传递给其回调的值返回。相反,您可以让FetchUsers
接收到用户数据时调用的回调(在这种情况下,执行该更改将相对简单(:
function User() {
console.log("Initializing User...");
FetchUsers(function(user) { // Changed!
$("#userSelect").append($("<option>").val(user.id).text(user.name));
});
<...>
}
function FetchUsers(callback) { // Changed!
console.log("Loading Users...");
$("#loading").show();
$.get(servlet, { command: "getUsers" }, function(data) {
//var users = new Array(); No longer necessary.
$(data).find("user").each(function() {
callback({ // Changed!
id: $(this).find("id").text(),
name: $(this).find("name").text()
});
});
<...>
}
用"已更改!"注释更改这三行应该足以使其正常工作。(尽管您对用户的日志记录需要稍作更改,因为它们不再被推入数组。
我承认我没有阅读和理解您源代码的每个部分(也没有检查是否所有大括号都已关闭(,但 FetchUsers 显然不会返回任何内容(与您的主张相反( - 因此对 FetchUsers(( 的调用计算结果为"未定义"。修复它需要一些重写,因为在 Javascript 中,您无法真正从同步函数(如 FetchUsers(((返回异步操作的结果(如 $.get( - 这将需要多线程(某种阻塞、等待等(。
- 阻止在select2单击时调用ajax
- 调用Ajax并返回响应
- Ajax:只在元素存在的情况下调用Ajax
- PHP,MySQL,AJAX-调用AJAX结果后,Bootstrap CSS样式不会显示
- 调用Ajax内部的函数
- 无法获取属性'的值;拆分'在IE8中调用ajax之后
- 我们如何在Firefox中调用AJAX
- Rails:通过调用Ajax重定向
- Cookie 在 Spotify (Javascript) 中调用 ajax 后未保存
- 通过调用 Ajax 来设置 struts bean 值
- 无法从服务器中的 php 调用 Ajax 函数
- 如何在附加表行时调用 ajax
- 在facebook用户发送邀请请求后调用ajax调用
- 定期调用Ajax
- 调用Ajax生成的表单的值
- 无法调用ajax函数
- 在调用AJAX之后显示ng控制器的内容;作为“;作用
- CSS,Java脚本在php中调用ajax后无法正常工作
- 成功调用AJAX后,Toast Growl不会出现
- 如何在调用AJAX时记录或捕获信息和错误