Question

这是场景。我有一些动态生成的JavaScript代码。因此，我没有使用打开输入框来读取userinput的prompt()，而是创建了一个自定义元素。因为我可以设置自定义输入框的样式而不是使用普通输入框。

因此，显示自定义输入框的功能类似于show_input()

这个动态生成的代码最后使用eval()执行。所以在代码中，在调用show_input()函数之后，程序应该等到用户输入值并按下按钮（我自定义输入表单中的按钮）。并且在生成的代码中会有多个对此函数的调用。

我不确定如何找到解决方案。也就是说，使其行为就像prompt()停止整个代码执行一样。

我试过的是，在我们的自定义输入框中使用布尔标志，该标志将在用户输入值并按下按钮时设置。所以，当调用我的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()

执行

任何想法都将受到高度赞赏。谢谢

Answer 1

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/

Answer 2

我发现您的场景难以理解，但假设您遇到的困难是将绑定用户交互与生成的代码绑定。为了尝试更清楚地了解您所面临的问题，以下工作会如何？如果没有，为什么不呢？

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

Here's a fiddle with an abstraction of the whole thing - 如果要扩展或更正它，请使用fork按钮创建自己的修改。

Answer 3

您需要检测输入框按钮上的点击事件。您可以使用onclick来触发检测用户是否填充输入的函数，如果输入已填满，则继续执行所需操作。您还可以使用overlay box输入输入和按钮

Answer 4

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

然而，我们采取的方法如下

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

除了这个问题，我没有任何解决方案。如果您找到除此之外的解决方案，请提供相同的解决方案。我发现很多人在同样的情况下受阻

JavaScript中的prompt（）替代方案

4 个答案: