I'm working on creating a service that allows you to create team or user based challenges. Using HTML 5 specifications to design the page, I've run into a bit of an issue appending to a drop down list that resides in another page. The entirety of functionality lives within two pages, mainly by making AJAX calls to other pages. There's a little function that appends 2 properties of a team to a drop down list, but I can't seem to get it to work properly.
我正致力于创建一项服务,允许您创建基于团队或用户的挑战。使用HTML 5规范来设计页面,我遇到了一个问题,附加到另一个页面中的下拉列表。整个功能都在两页内,主要是通过对其他页面进行AJAX调用。有一个小功能可以将团队的2个属性附加到下拉列表中,但我似乎无法让它正常工作。
Code:
var teams = $.parseJSON(getAllTeams());
$('#multiPurpose').load('allTeams2.html #teamSelect');
for (i = 0; i < teams.length; i++) {
var team = $.parseJSON(getTeam(teams[i]));
if (team.ownerID === userID) {
$(
"<option value='" + team.teamID + "'>" + team.teamName
+ "</option>").appendTo('#teamSelection');
}
}
}
The #teamSelection is contained within the #teamSelect div. Any help would be great.
#teamSelection包含在#teamSelect div中。任何帮助都会很棒。
1 个解决方案
#1
2
Adding a callback function within .load() will solve the problem. Basically, you're telling it to load everything within that div before running the for loop.
在.load()中添加回调函数将解决问题。基本上,你告诉它在运行for循环之前加载该div中的所有内容。
$('#multiPurpose').load(
'allTeams2.html #teamSelect',
function() {
for (i = 0; i < teams.length; i++) {
var team = $.parseJSON(getTeam(teams[i]));
if (team.ownerID === userID) {
$(
"<option value='" + team.teamID + "'>"
+ team.teamName + "</option>")
.appendTo('#teamSelection');
}
}
});
#1
2
Adding a callback function within .load() will solve the problem. Basically, you're telling it to load everything within that div before running the for loop.
在.load()中添加回调函数将解决问题。基本上,你告诉它在运行for循环之前加载该div中的所有内容。
$('#multiPurpose').load(
'allTeams2.html #teamSelect',
function() {
for (i = 0; i < teams.length; i++) {
var team = $.parseJSON(getTeam(teams[i]));
if (team.ownerID === userID) {
$(
"<option value='" + team.teamID + "'>"
+ team.teamName + "</option>")
.appendTo('#teamSelection');
}
}
});