Question

我试图了解如何制作像windows.prompt（）这样的东西，就像你在调用它作为一个函数一样，它会给你按下按钮的结果。 IE。

var a = customPrompt('message', ['buttonName1','buttonName2']);

我正在寻找像以下这样的功能：

function customPrompt(message, buttonNames){
    $('body').append($("<div id='Calert'>").append($("<div id='CalertMessage'>").text(message)));
    $('#Calert').append($("<div id='CalertButtons'>"));
    for(var i=0;i<buttonNames.length;i++){
        $('#CalertButtons').append($("<div id='CalertButton'>").text(buttonNames[i]));
    }
    Here, the function needs to return which button was clicked.
}

我遇到的主要问题是，如果我给按钮一个onclick，那么它违反了范围，我无法从我的customPrompt函数返回。但我无法让整个网页等到按下按钮。

Answer 1

该功能应该是这样的：

function customPrompt(message, buttonNames, callback){
    $('body').append($("<div id='Calert'>").append($("<div id='CalertMessage'>").text(message)));
    $('#Calert').append($("<div id='CalertButtons'>"));
    buttonNames.forEach(function(name, index) {
        var $button = $("<div id='CalertButton'>").text(name).appendTo('#CalertButtons'); // create the button
        $button.on('click', function() {                // when the button is clicked
            // probably destroy the dialog box
            callback(name, index);                      // call the callback passing to it the name and the index of the clicked button
        });
    });
}

然后你可以像这样使用它：

customPrompt("Hello, wolrd!", ["aaa", "bbb"], function(name, index) {
     // if the user clicks the aaa button then: name === 'aaa' and index === 0
     // if the user clicks the bbb button then: name === 'bbb' and index === 1
});

如何获得一个函数来返回onclick函数的结果？

1 个答案: