javascript - 如何等待消息框的返回值

Question

我有一个调用过程，它调用我的消息框并期望返回值:

text = 'do you want?';
buttons = Array('Yes','No','Perhaps');
param = Array(text,buttons);
returnvalue = msg(param);

alert(returnvalue);

这会调用填充消息框的函数。填写后显示消息框。到目前为止它有效。 但是:它不会等待(显示后)生成并返回所选值。我在哪里以及如何实现回调？

function msg(arr) {
    var text = arr[0];
    var buttons = arr[1];
    $('#modal-text-msg').html(text);
    out = '';
    for (i = 0, len = buttons.length; i < len; i++) {
        console.log(buttons[i]);
        out += '<input type="button"  class="modal-button modal-button-msg" value="'+buttons[i]+'">';
    }
    $('#modal-close-msg').html(out);    
    $('#modal-msg').show();

    $('.modal-close').on('click', '.modal-button-msg', function(e) {
    returnvalue = $(this).val();
    $('#modal-msg').hide();
    return returnvalue;
    }); 
}

Answer 1

您需要使用回调函数。 Javascript 没有 sleep 或等待命令。即使确实如此，当 Javascript 不被允许继续运行时，也会发生不好的事情。尝试将 msg 更改为:

function msg(arr, callback) {
    var text = arr[0];
    var buttons = arr[1];
    $('#modal-text-msg').html(text);
    out = '';
    for (i = 0, len = buttons.length; i < len; i++) {
        console.log(buttons[i]);
        out += '<input type="button"  class="modal-button modal-button-msg" value="'+buttons[i]+'">';
    }
    $('#modal-close-msg').html(out);    
    $('#modal-msg').show();

    $('.modal-close').on('click', '.modal-button-msg', function(e) {
        returnvalue = $(this).val();
        $('#modal-msg').hide();
        if (callback instanceof Function) callback(returnvalue);
    }); 
}

不需要返回 returnvalue;，因为这会将其返回给事件处理程序，而不是msg 的调用者。打电话的人已经继续前进了。现在您可以像这样调用 msg:

msg(param, function(value) {
  alert(value);
});