在javascript中制作自定义确认框

时间:2012-12-16 19:14:42

标签: javascript sleep wait

我想在javascipt中制作一个自定义的确认框,就像内置的确认框一样。除非用户选择至少一件事,否则内置确认框不允许代码进展。以下是我的代码: * ** * * HTML启动 * ** * *

<div class = "popUp confirm" style="z-index:40000;"  id="confirmBlock">         
<div id = "confirmLabel" >Confirm Message</div>
<div style ="border:0px solid red;height:44.56px;">
<input id="Confirm" type="button" value="Confirm" onclick = "confirmAction(1)" />
<input id = "CancelConfirm" type="button" value="Cancel" onclick = "confirmAction(0)" />
</div>
</div>

** * ** HTML结束 * ** * *

** * ** Javascript start * ** * *

var confirmresult = "-1";

function confirmationLoop()
{
    alert("If this alert is preesnt it works, seems like the built in alert provides some sort of pause for other parts of code to continue to work");

    if(confirmresult == "-1")
        confirmationLoop();     

    return; 
} 

function confirmAction(val)
{


    confirmresult = val;    
}

function checkuuu()
{
    confirmresult = "1";
}

function confirmMessage(message)                
{   
    document.getElementById("confirmLabel").innerHTML= message;
    //var check = setTimeout(function(){confirmAction(1)},5000);
    confirmationLoop(); 
    /*
    while(1)            //using while almost does not allow any other part to run at all hence tried recursion
    {
        if(confirmresult != "-1")
            break;  
    }
    */
    document.getElementById("confirmLabel").innerHTML= "Confirm Message";   
    var returnVal = confirmresult;
    confirmresult = -1;
    return returnVal;
}

** * ** Javascript结束 * ** * *

** * ** 示例代码开始 < EM> * ** * * 所以这就是我对下面的期望:

function example
{
    var check = confirmMessage(message);
    //the next part of code should not execute untill i press confirm or cancel, using settimeout or settimeinterval is asynchronous and the code flow continues. i want the effect something like alert and confirm built in boxes         
}

** * ** 示例代码结束 < em> * ** * *

我使用循环,但它保持线程完全占用,并没有给我机会按任何按钮,这是非常明显的 然而,递归使您可以自由地执行其他活动。问题,即使按下确认按钮,confirmResult的值将变为1,我通过警报检查。递归循环,即确认循环似乎不读为1.它仍然继续为-1。如果我在该确认循环中发出警报,则该值将被读为1.任何人都可以帮助我实现我的开始吗?????? P.S =&GT。抱歉这么大的问题!!!

1 个答案:

答案 0 :(得分:1)

您不能使用任何类型的循环 - 因为您发现它只会导致浏览器锁定。

您需要做的是模仿“模态”对话框。

这通常是通过让您的对话框显示在另一个“重叠”元素的顶部来完成的,重要涵盖所有其他元素,并阻止任何用户与它们互动。

实现一个confirm函数也很难返回一个值 - window.confirm方法只能这样做,因为它是同步的 - 它会在显示对话框时阻止所有其他JS处理。

最简单的方法是提供一个回调函数,一旦用户选择了所需的值就会调用它。