jquery - 在jQuery中动态添加元素后无法获取字典的长度
问题描述
首先,我使用 ajax 通过添加到我在 ajax 之前声明的 dict 变量来接受 JSON 数据。
我想得到字典的长度,但这里是输出:
并且 dict 输出旁边的消息显示“刚刚评估了下面的值”:
这是我的代码:
<script>
$(function () {
var table_id = $('#table_id').text();
var list_length = $.words_list(table_id);
});
//function
jQuery.extend({
'words_list': function (id) {
var send_list = {};
$.ajax({
type: 'GET',
url: '/get_wordslist/' + id,
success: function (returnData) {
$.each(returnData, function (item, value) {
send_list[item] = value;
});
}
});
console.log(send_list);
console.log('length:' + Object.keys(send_list).length);
return 1;//just for returning
}
});
</script>
根据消息,我认为我需要使用另一个变量来记录长度,如下所示:
<script>
$(function () {
var table_id = $('#table_id').text();
var list_length = $.words_list(table_id);
});
jQuery.extend({
'words_list': function (id) {
var send_list = {};
var list_length = 0;// add a variable
$.ajax({
type: 'GET',
url: '/get_wordslist/' + id,
success: function (returnData) {
$.each(returnData, function (item, value) {
send_list[item] = value;
list_length++;//record increase
});
}
});
console.log(send_list);
console.log('length:' + list_length);//show
return 1;//just for returning
}
});
</script>
但是输出是一样的。我与这样的简单代码进行比较:
var dict = {
"Jeremy": 20,
"Jimmy": 30
};
console.log(dict);
console.log(Object.keys(dict).length);
这是输出:
这是我的预期结果。根据消息,我认为动态添加元素到 dict 是问题的原因。但是我尝试使用变量来记录长度,也失败了。现在我不知道如何解决这个问题。请帮助我并告诉我原因,首先谢谢。
解决方案
因为 ajax 是异步的,所以在你的时候console.log('length:' + list_length);
,success 函数还没有运行。要获得预期的结果,您需要登录成功功能。像这样的东西:
var send_list = {};
var list_length = 0;// add a variable
$.ajax({
type: 'GET',
url: '/get_wordslist/' + id,
success: function (returnData) {
$.each(returnData, function (item, value) {
send_list[item] = value;
list_length++;//record increase
});
// Log here
console.log(send_list);
console.log('length:' + list_length);
}
});
推荐阅读
- sql - 使用交叉应用将列转置为行
- magento2 - 在 Magento 2 中启用 DHL Marketplace
- asterisk - 如果被叫/设备离线,则转接呼叫
- scheduled-tasks - 没有服务器的 Knime Windows 调度程序任务
- java - 在java中为类变量添加值的优雅方法
- grep - 如何grep至少一个字符和双斜杠
- javascript - 通过 onclick 事件在 JPlayer 上播放歌曲
- javascript - Angular 7将数据添加到http请求的结果
- php - 使用 Laravel 使用另一个表中的数据从下拉列表中插入表
- mysql - 列出属于 mysql 中数据库的操作 - (SHOW PROCESSLIST)