1

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

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

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

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

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

有什么方法可以模仿该功能的prompt()工作原理。我的意思是，暂停整个页面，直到用户按下按钮？

setTimeout()在我的情况下，函数不是一个好的选择。因为原因是，我生成的代码看起来像这样：

statement1;
statement2;

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

statement3;

show_input();

statement4;
statement5;
// etc...

因此，在 之后statement2，函数调用用于显示自定义输入框，要求用户输入值并按下按钮。只有在按下此按钮后，它才应该转到statement3。到那时，它应该等待用户按下我的自定义输入框中的按钮。

我正在使用 jQuery，并且该按钮添加了一个单击事件。

以上代码在运行时生成，使用eval()

任何想法将不胜感激。谢谢

4

4 回答 4

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/

于 2013-03-07T13:15:03.677 回答
1

我发现您的场景难以遵循，但假设您面临的困难是将用户交互绑定到生成的代码。为了尝试更清楚地了解您面临的问题，以下方法会起作用吗？如果不是，为什么不呢？

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

这是对整个事物的抽象的一个小技巧——如果您想扩展或更正它，请使用 fork 按钮创建您自己的修改。

于 2013-03-07T13:05:14.230 回答
1

您需要检测输入框按钮上的点击事件。您可以使用onclick触发一个功能来检测用户是否填写了输入，如果输入已填写，那么您继续执行您想要的操作。您还可以使用覆盖框来放置输入和按钮

于 2013-03-07T13:07:02.850 回答
0

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

但是我们采取的方法如下

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

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

于 2013-03-07T13:16:14.370 回答