JavaScript的难题解决：window.confirm = divConfirm（strMessage） [英] JavaScript puzzle to solve : window.confirm = divConfirm(strMessage)

问题描述

情景是：旧的网站，其中有很多JS code已经写好。如果用户想改变所有的警报消息，以新时代的爵士事业部根据警报，这是非常常见的使用JQuery，YUI，原型...等
主要有树JS对话框
1。警报

为了改变这种以其简单，我们只需要编写新的功能，它会显示在div弹出窗口并显示信息，之后覆盖window.alert

功能showDivAlert（strMessage）{
// DIV弹出逻辑和code
}
 
window.alert = showDivAlert;


2。提示

这也看起来很容易编写函数接受字符串，并显示输入值的文本框。现在，作为回报的行动是基于确定按钮，生命的点击是很容易在这里。

功能shoDivPromp（strMessage）{
// DIV弹出来显示文本框，并接受来自用户的
输入 }
window.prompt = shoDivPromp;


3。确认

现在上述两个很容易重写和修改默认的对话，但是有复杂的确认。
但是默认JS确认对话框停止JS执行，当用户单击确定或取消执行由确定的返回值（真/假）恢复。但是，如果我们的用户DIV弹出的执行不会停止这是问题。
我们仍然可以实现确认但在这种情况下，我们必须要绑定的确定方法和取消的情况下，将被连接到确定和取消按钮。有了这个功能，签名会等。 函数newConfirm（味精，有趣OkAction（），有趣CancelAction）

现在，这是问题，这不能帮我换的确认对话框整个网站就像我们做了警报（）; 问题
我不知道是否它可以或不可以实现，但我认为可以使用一些JS格局。因此，让我知道，如果它的可能。

解决方案

  

现在这个问题，这个不能帮我换的确认对话框整个网站就像我们做了警报（）;

这是正确的。这是不可能重现的警报/确认/提示功能的同步特性的原生JavaScript。还有就是非标准方法在showModalDialog ，可以使用单独的弹出文档做到这一点，但它不支持所有的浏览器，它通常被认为极不可取的。

所以插件，替换策略是行不通的。你将不得不改变你每次调用的脚本的其余部分，这些方法的地方。

通常的模式是使用内联匿名函数做到这一点，以preserve使用闭包，如局部变量。替换：

 函数buttonclick（）{
    VAR ID = this.id;
    如果（+ ID +确认（'你想FROB你确定''？'））
        FROB（ID）;
    擦（ID）;
}
 

与

 函数buttonclick（）{
    VAR ID = this.id;
    myConfirm（'您确定要FROB+ ID +'？'，函数（确认）{
        如果（确认）
            FROB（ID）;
        擦（ID）;
    }）;
}
 

如果您需要这是preserved你需要看进一步的嵌套关闭或function.bind做到这一点。如果您有您的来电确认在循环事情变得相当困难。

显然，你还必须确保重要的全球状态不发生改变，同时确认框了起来。通常这种风险以灰色的页面的其余部分与覆盖层以阻止点击获得通过最小化。但是，如果你有超时他们仍然可以开火。

Scenario is : old site which has lots of JS code already written. If user want to change all the alert messages to new age jazzy Div based alert which are very common using JQuery, YUI, Prototype... etc.
There are mainly tree JS dialogs
1. alert

To changes this its simple we just have to write new function which will show the div popup and show the message, after that override the window.alert

function showDivAlert(strMessage){
//div popup logic and code
}

window.alert = showDivAlert;


2. prompt

This too look easy to write function to accept the string and show the text box for input value. Now as return action is based on the click of "OK" button life is easy here.

function shoDivPromp(strMessage){
//div pop up to show the text box and accept input from the user
}
window.prompt = shoDivPromp;


3. confirm

Now above two were easy to override and modify the default dialogs but there is complication with the confirm.
However default JS confirm dialog stops JS execution and when user click OK or Cancel execution is resumed by determining the return value (true/false). But if we user div popup the execution is not stopped which is problem.
We can still implement the confirm but in that case we have to bind methods for OK and CANCEL case which will be attached to OK and CANCEL button. With this function signature will be like. function newConfirm(msg, fun OkAction(), fun CancelAction)

Now this is problem that this cant help me change the confirm dialog across the site as we did with alert(); Question
I am not sure whether its possible or not to achieve but i think can be using some JS pattern. So let me know if its possible.

解决方案

Now this is problem that this cant help me change the confirm dialog across the site as we did with alert();

That's correct. It's not possible to reproduce the synchronous nature of the alert/confirm/prompt functions in native JavaScript. There is the non-standard method showModalDialog which can do it using a separate pop-up document, but it's not supported by all browsers and it's generally considered highly undesirable.

So the plug-in-replacement strategy isn't going to work. You are going to have to change every place you called these methods in the rest of the script.

The usual pattern is to do it using inline anonymous functions, to preserve the local variables using a closure, eg. replace:

function buttonclick() {
    var id= this.id;
    if (confirm('Are you sure you want to frob '+id+'?'))
        frob(id);
    wipe(id);
}

with:

function buttonclick() {
    var id= this.id;
    myConfirm('Are you sure you want to frob '+id+'?', function(confirmed) {
        if (confirmed)
            frob(id);
        wipe(id);
    });
}

If you need this to be preserved you would need to look at a further nested closure or function.bind to do it. If you have your call to confirm in a loop things get considerably more difficult.

Obviously you also have to ensure that critical global state doesn't change whilst the confirm box is up. Usually this risk is minimised by greying out the rest of the page with an overlay to stop clicks getting through. However if you have timeouts they can still fire.

这篇关于JavaScript的难题解决：window.confirm = divConfirm（strMessage）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！