我有一个简单的jquery loop
。在这个循环中我打电话给jquery function
。但是这里发生的是functions
被称为paralally
。当previous function
呼叫仍为running
时,循环再次呼叫same function
。因此,仅对最后properly
次呼叫输出function
。上一次jquery
来电执行javascript
后如何调用function
或completely
功能?
这是我的循环
$("select.project_dp").each(function(index) {
populate_tasks($(this));
});
这是函数定义。
function populate_tasks(project_dp) {
alert("asdfsdfasdfa");
project_id = project_dp.val();
next_td = project_dp.parent().next( "div" ).find("select");
customer_div = project_dp.parent().next( "div" ).next( "div" ).find(".customer_hidden");
start_time = project_dp.parent().next( "div" ).next( "div" ).next( "div" ).find(".start_time");
end_time = project_dp.parent().next( "div" ).next( "div" ).next( "div" ).next( "div" ).find(".end_time");
hrs_dp = project_dp.parent().next( "div" ).next( "div" ).find(".hrs_dp");
mins_dp = project_dp.parent().next( "div" ).next( "div" ).find(".mins_dp");
next_td.empty();
$.ajax({
type: "GET",
url: '/log_times/populate_tasks',
dataType: "JSON",
data: {proj_id: project_id },
success:function(data) {
console.log(data);
next_td.empty();
customer_div.val(data.cust_id)
jQuery.each(data.tasks,function(i, v) {
next_td.append($('<option value="'+ data.tasks[i]["id"] +'">'+data.tasks[i]["name"] +'</option>'));
});
if (data.project.hrs_calc_criteria == "By Duration") {
hrs_dp.prop('disabled', false);
mins_dp.prop('disabled', false);
start_time.prop('disabled', true);
end_time.prop('disabled', true);
} else if (data.project.hrs_calc_criteria == "By Start & End Time") {
hrs_dp.prop('disabled', true);
mins_dp.prop('disabled', true);
start_time.prop('disabled', false);
end_time.prop('disabled', false);
}
}
});
}
答案 0 :(得分:0)
传递回调函数:
function myCallback() {
alert("Complete!");
}
$("select.project_dp").each(function(index) {
populate_tasks($(this), myCallback);
});
完成所有操作后,您只需在callbackFunction
功能结束时致电populate_tasks()
。
callbackFunction();
您需要populate_tasks()
函数接受新参数:
function populate_tasks(project_dp, callbackFunction) {
alert("asdfsdfasdfa");
project_id = project_dp.val();
next_td = project_dp.parent().next( "div" ).find("select");
customer_div = project_dp.parent().next( "div" ).next( "div" ).find(".customer_hidden");
start_time = project_dp.parent().next( "div" ).next( "div" ).next( "div" ).find(".start_time");
end_time = project_dp.parent().next( "div" ).next( "div" ).next( "div" ).next( "div" ).find(".end_time");
hrs_dp = project_dp.parent().next( "div" ).next( "div" ).find(".hrs_dp");
mins_dp = project_dp.parent().next( "div" ).next( "div" ).find(".mins_dp");
next_td.empty();
$.ajax({
type: "GET",
url: '/log_times/populate_tasks',
dataType: "JSON",
data: {proj_id: project_id },
success:function(data) {
console.log(data);
next_td.empty();
customer_div.val(data.cust_id)
jQuery.each(data.tasks,function(i, v) {
next_td.append($('<option value="'+ data.tasks[i]["id"] +'">'+data.tasks[i]["name"] +'</option>'));
});
if (data.project.hrs_calc_criteria == "By Duration") {
hrs_dp.prop('disabled', false);
mins_dp.prop('disabled', false);
start_time.prop('disabled', true);
end_time.prop('disabled', true);
} else if (data.project.hrs_calc_criteria == "By Start & End Time") {
hrs_dp.prop('disabled', true);
mins_dp.prop('disabled', true);
start_time.prop('disabled', false);
end_time.prop('disabled', false);
}
// Call your callback function when this function completes
//
callbackFunction();
}
});
}
你必须调用populate_tasks()并传递一个指向要执行的回调函数的paremter,所以如果我们有一个名为myCallback
的函数,你希望在populate_tasks()
结束时运行:
populate_tasks($(this), myCallback);
callback_function
实际上只是指向您传递的任何函数的指针,在本例中为myCallback
对于应该在回调函数中的代码......由您自己决定,我不知道在populate_tasks()
函数完成时您打算做什么。
答案 1 :(得分:0)
我非常确定您可以使用队列或承诺来解决您的问题。 另一种方法可以是类似于此的递归函数:
var i = 0;
var tasks = [];
$("select.project_dp").each(function(index) {
tasks.push($(this));
});
populate_tasks(tasks[i]);
function populate_tasks(project_dp) {
if(i <= tasks.length){
alert("asdfsdfasdfa");
project_id = project_dp.val();
next_td = project_dp.parent().next( "div" ).find("select");
customer_div = project_dp.parent().next( "div" ).next( "div" ).find(".customer_hidden");
start_time = project_dp.parent().next( "div" ).next( "div" ).next( "div" ).find(".start_time");
end_time = project_dp.parent().next( "div" ).next( "div" ).next( "div" ).next( "div" ).find(".end_time");
hrs_dp = project_dp.parent().next( "div" ).next( "div" ).find(".hrs_dp");
mins_dp = project_dp.parent().next( "div" ).next( "div" ).find(".mins_dp");
next_td.empty();
$.ajax({
type: "GET",
url: '/log_times/populate_tasks',
dataType: "JSON",
data: {proj_id: project_id },
success:function(data) {
console.log(data);
next_td.empty();
customer_div.val(data.cust_id)
jQuery.each(data.tasks,function(i, v) {
next_td.append($('<option value="'+ data.tasks[i]["id"] +'">'+data.tasks[i]["name"] +'</option>'));
});
if (data.project.hrs_calc_criteria == "By Duration") {
hrs_dp.prop('disabled', false);
mins_dp.prop('disabled', false);
start_time.prop('disabled', true);
end_time.prop('disabled', true);
} else if (data.project.hrs_calc_criteria == "By Start & End Time") {
hrs_dp.prop('disabled', true);
mins_dp.prop('disabled', true);
start_time.prop('disabled', false);
end_time.prop('disabled', false);
}
i ++;
populate_tasks(tasks[i]);
}
});
}
}
基本上,你首先在第一个元素上运行该函数,一旦完成,你就可以在第二个元素ecc上执行你的函数......直到任务结束。