2013-03-07 66 views
1

以下是该方案。我有一些可以即时生成的JavaScript代码。因此,我没有使用打开用于读取userinput的输入框的prompt(),而是制作了一个自定义元素。因为我可以设置我的自定义输入框而不是使用正常的输入框。JavaScript中提示()的替代方法

因此,为了显示自定义输入框的功能是一样的东西,show_input()

和动态生成的代码,在使用eval()年底执行。所以在代码中,在调用show_input()函数之后,程序应该等待直到用户输入值并按下按钮(我自定义的输入表单中的按钮)。并且在生成的代码中会有多次调用此函数。

我不知道如何找到解决方案。也就是说,使其行为就像停止整个代码的执行一样。

我试过的是,在我们的自定义输入框中,使用一个布尔标志,当用户输入数值并按下按钮时,该布尔标志将被设置。所以,当我的show_input()被调用时,它会显示自定义输入框,然后进入一个无限循环,只有当这个布尔标志设置时才会停止。但是这会冻结网页,使其无法响应。所以,这不是一个好的解决方案。

有没有什么办法模仿prompt()函数的工作原理。我的意思是,暂停整个页面,直到用户按下按钮?

setTimeout()函数在我的情况下不是一个好的选择。因为原因是,产生我的代码会是这个样子:

statement1; 
statement2; 

show_input(); //call the function to show my custom inputbox 

statement3; 

show_input(); 

statement4; 
statement5; 
// etc... 

所以,statement2后,函数调用是用于显示自定义输入框,要求用户输入的值,并按下一个按钮。只有按下此按钮后,才能转到statement3。直到那时,它应该等待用户按下我的自定义输入框中的按钮。

我正在使用jQuery,并且该按钮有一个点击事件添加到它。

在运行时生成上面的代码中,使用eval()

任何想法,将高度赞赏执行。 谢谢

+1

你所说的input()究竟是什么?这不是原生JavaScript。 – 2013-03-07 13:07:23

+0

使用事件。这意味着你将不得不让你的代码更加安全。例如,调用'show_input()'后,你不应该有更多的代码“等待”。您的代码应该完成,并且一旦用户触发事件(OK按钮),您将执行另一个功能。 – TheBronx 2013-03-07 13:10:03

+0

你最好的选择是使用[showModalDialog()](https://developer.mozilla.org/en-US/docs/DOM/window.showModalDialog),否则这对于JavaScript来说是不可能的。 – Teemu 2013-03-07 13:15:32

回答

2

JavaScript的执行模型不允许您尝试实现的目标,因为无法“阻止”等待DOM输入的脚本执行。就像你在循环尝试中注意到的一样,页面被冻结,直到脚本结束运行,然后才恢复正常的事件处理。

因此,请改为创建一个回调函数,其中包含要在用户输入后执行的语句,并让输入系统调用它。例如:

// statement 1 and 2 here 

var callback = function(value) { 
    // statement 3 here 
} 

show_input(callback); 

然后内部show_input绑定用户确认检索的值的函数然后调用使用所述值提供给它的回调函数。例如(使用jQuery的简洁的语法,但是这不是绝对必要使用它):

function show_input(callback) { 
    // create the input form 
    $(confirm_button).click(function() { 
     callback($(input).value()); 
    }); 

这当然可以被嵌套到任意级别需要。在嵌套时,如果重新使用现有的窗口小部件(而不是创建新的窗口小部件),必须小心以前的回调事件在绑定新的窗口之前未被绑定 - 如果需要,您还可以保留对事件处理程序的引用以便将其删除明确地说,但是对于大多数情况下,解除所有事件都应该足够了。

看到一个例子小提琴:http://jsfiddle.net/YTcy8/

+0

谢谢。并且对于延迟回复感到抱歉。正在逐一阅读。我试图找出是否有更好的解决方案。我想我可能最终会有这样的事情。 – 2013-03-07 13:40:28

+0

经过测试,这似乎是最好的解决方案。谢谢:) – 2013-03-07 14:39:47

+0

嗯..我喜欢这种方法,并正在测试它。但嵌套时似乎不工作。你能检查一下吗? – 2013-03-07 15:54:47

1

我发现你的情况很难遵循,但假设你面临的困难是将用户交互绑定到生成的代码。为了尝试更清楚地了解您所面临的问题,下面的工作会是什么?如果不是,为什么不呢?

$('#thebutton').on('click', statement3); 

Here's a fiddle with an abstraction of the whole thing - 用叉按钮来创建你自己的修改,如果你想扩展或纠正。

+0

谢谢,但这并没有帮助。因为我想要做的是在运行时创建JavaScript代码(只有几行代码),然后通过'eval()'执行它。所以,问题在于使用替代'input()'。我想让代码暂停,直到用户按下按钮。请注意,我有事件附加到按钮和其他东西。当用户按下按钮(我的自定义输入框上的按钮)时,将会设置一个全局布尔标志。 – 2013-03-07 13:11:15

+0

你能详细说明这个'alternative'input()'是什么吗?我现在不太明白。就执行生成的代码而言,[我更新了我的示例以使用textarea来包含任何代码,以此作为执行在运行时不知道的代码的概念验证](http://jsfiddle.net/barney/HkARv/1 /) - 当用户点击按钮时,它将作为'statement3'的一部分执行。我仍然认为一个澄清的用例解释了什么是生成的,什么不是,input()的意思,以及'暂停'的意思,这将是一个好主意...... – Barney 2013-03-07 13:17:07

+0

对不起。使用了错误的函数名称。它是'prompt()',输入框。 – 2013-03-07 13:18:39

1

您需要检测输入框按钮上的单击事件。您可以使用onclick来触发一个函数,该函数检测用户是否填充了输入,如果输入已填充,则继续按照您的要求进行操作。您也可以使用overlay box来放置输入和按钮

+0

谢谢。我知道那一部分,我已经实现了它。这不是我遇到的问题。试图停止执行程序。然后在输入后重新开始。 – 2013-03-07 13:20:04

0

我们有类似的情况,我们不得不停止为用户输入脚本执行,我们无法搜索了将近2 3个月后找到任何解决方案。之后,我们放弃了这个想法,因为这是不可能的。

然而,我们采取的方法是如下

statement 1 
statement 2 
showInput(function() { 
    statement3; 
    showInput(function() { 
       statement4; 
       statement5; 
      }) 
     }) 

我没有这除了一个你的问题的任何解决方案。如果您发现除此之外的解决方案,请提供相同的解决方案。我发现很多在相同情况下被阻止的人

+0

谢谢。如果我找到一个好的解决方案,会让你知道。 – 2013-03-07 13:26:56