Javascript - 等待一个功能完成

时间:2012-04-25 07:58:23

标签: javascript

我需要使用jquery对话框来实现确认框替换。我有一个像这样的调用函数

function callingFunc() {

 var a = confirmJquery("text", 300, 300, "ok", "cancel"); 

 if (a == true) {
   .....
 }
 else {
   .... 
 }
}

这是confirmJquery函数

function confirmJquery(msg, width, height, txtOk, txtCancel) {

    var div = document.createElement('div');
    div.className = "confirmJquery";

    var span = document.createElement('span');
    $(span).html(msg);
    div.appendChild(span);

    var buttonOk = document.createElement('button');
    buttonOk.className = 'buttonStyleBigger';
    $(buttonOk).html(txtOk);

    var buttonCancel = document.createElement('button');
    buttonCancel.className = 'buttonStyleBigger';
    $(buttonCancel).html(txtCancel);

    var divBottom = document.createElement('div');
    divBottom.className = 'dialogAction';

    divBottom.appendChild(buttonOk);
    divBottom.appendChild(buttonCancel);

    div.appendChild(divBottom);

    var dialog = window.parent.$(div).appendTo(window.parent.document.body);

     // open the dialog
    dialog.dialog({
        height: height,
        width: width,
        resizable: false,
        // add a close listener to prevent adding multiple divs to the document
        close: function(event, ui) {
            // remove div with all data and events
            dialog.remove();
        },
        modal: true
    });

    $(buttonOk).bind('click', function(){
        return true;

    });

    $(buttonCancel).bind('click', function() {

        return false;
    });

}

问题是,在按下按钮(确定或取消)之前,confirmJquery功能总是完成;因此,调用函数没有任何价值。我需要让confirmJquery等待,直到用户按下按钮然后功能完成,其余的调用功能继续。我怎样才能做到这一点 ?

我需要更新更多细节:我已经尝试了回调功能方式。它完美地运作。但是,生活并不容易。这是一个非常庞大,陈旧,混乱的系统。这样做需要我重写很多函数,所以我需要创建一个与javascript的确认函数完全相同的函数

4 个答案:

答案 0 :(得分:3)

由于您的函数将是异步的,因此您需要使用回调。像这样:

function myCallback(result)
{
  if (result) {
    // OK
  } else {
    // Cancel
  }
}

function confirmJquery(msg, width, height, txtOk, txtCancel, callback) {
...
    $(buttonOk).bind('click', function(){
        callback(true);
    });

    $(buttonCancel).bind('click', function() {
        callback(false);
    });
}

confirmJquery(msg, width, height, txtOk, txtCancel, myCallback);

答案 1 :(得分:0)

将函数的其余部分移到另一个函数中,并在confirmJquery函数的末尾执行第二个函数。

function firstfunction(){

  // Do Some Stuff

  secondfunction();

}

答案 2 :(得分:0)

首先,为了避免接收端的一长串参数,您可以使用参数对象。然后通过回调发送到confirmJquery

function callingFunc() {

    var a = confirmJquery({
        msg:"text", 
        width:300, 
        height:300, 
        txtOk:"ok", 
        txtCancel:"cancel"
    },function(ok){
        if(ok){
            ...
        } else {
            ...
        }
    });
}

function confirmJquery(options,callback) {
    //options.msg
    //options.width
    ...

    $(buttonOk).bind('click', function(){
        callback(true);
    });

    $(buttonCancel).bind('click', function() {
        callback(false);
    });

}

答案 3 :(得分:0)

是的,亚历山大是对的,只是重新组织代码,一个用于对话,一个用于基于标志/ msg的功能。就像mvc模式一样。