如何执行循环，直到用户在提示时选择取消？答案

【问题标题】：How to execute loop until user selects Cancel upon prompt?如何执行循环，直到用户在提示时选择取消？
【发布时间】：2016-06-15 04:01:19
【问题描述】：

我正在编写一个程序，将用户输入分解为字母，然后显示为 ASCII 字符。

用户可以在提示框中反复输入输入，直到他选择Cancel、按下Enter 键或Esc 键。

例如，如果您在提示时输入“Hello”，然后输入“Bye”，并且第三次按下 Enter 键而不输入任何内容，您应该会看到：

Word entered is "Hello"
H = 72
e = 101
l = 108
l = 108
o = 111

Word entered is "Bye"
B = 66
y = 121
e = 101

我的问题是

1) “输入的单词是...”这一行没有出现，并且

2) 无论用户是否留空，提示信息只执行一次。

我的代码如下所示：

<script>
    do {
        var word = prompt ("Please enter a word of your choice");
        if (word == null)
            document.getElementById("myDiv").innerHTML = "Word entered is " + "\"" + word + "\"";
        else
            break;
    } while (word == null);

    var letter = "<ul>";

    for (var i = 0; i < word.length; i++){
        letter += word[i] + " = " + word.charCodeAt(i) + "<br>";
    }

    letter += "</ul>";
    document.getElementById("myDiv").innerHTML = letter;
</script>

【问题讨论】：

标签： javascript loops for-loop ascii do-while

【解决方案1】：

我认为您需要用“”分隔“单词”，并列出每个单词的字母。

// this function make the variables not glabel.
(function() {
  var words = '';

  while (words === '') {
    // get the input until something not empty or 'Esc'
    words = prompt("Please enter a word of your choice");
  };

  // this function will return the HTML which will list the letters of the word
  var listLetters = function(word) {
    letters = "";
    for (var i = 0; i < word.length; i++) {
      letters = letters + word[i] + " = " + word[i].charCodeAt() + "<br>";
    }
    return letters;
  }

  // get target
  var t = document.getElementById("myDiv");
  // empty the target
  t.innerHTML = '';

  // process the inputs
  words.split(' ').forEach(function(word) {
    // print the word
    t.innerHTML += 'Word entered is "' + word + '"<br>';
    // list the letters
    t.innerHTML += listLetters(word) + '<br>';
  });

})();

&lt;div id='myDiv'&gt;&lt;/div&gt;

【讨论】：

【解决方案2】：

您正在检查他们是否没有输入单词，然后您正在显示单词变量。您只想显示他们选择的单词，如果它不为空。

【讨论】：

【解决方案3】：

看代码https://jsfiddle.net/q41gm0j6/

基本上你错过了回报；

  (function(){
    do {
     var word = prompt ('Please enter a word of your choice');
       if (word === '' || word === null){
         word = '';
         var t = document.getElementById('myDiv');
         t.innerHTML = 'Word entered is' + word;
         return;
        }
        else break;
    } while (word === null);
      var letter = '<ul>';
      for (var i = 0; i < word.length; i++){
        letter += word[i] + ' = ' + word.charCodeAt(i) + '<br>';
      }
      letter += '</ul>';
      document.getElementById('myDiv').innerHTML += letter;
   })();

【讨论】：

有没有办法在不使用函数的情况下做到这一点？
您可以删除 (function(){}(); 我添加了，它所做的只是确保脚本在加载 html 页面之前不会运行。如果您放置 javascript 代码在 myDiv 下的某个地方，那么你不需要它，所以代码就是你写的删除第一行和最后一行
我想我误解了你最初想要的东西，你去jsfiddle.net/q41gm0j6/1这会为你解决问题

【解决方案4】：

检查这个 plunker 代码，我为您创建了以实现所需的功能。希望对您有所帮助。

您的问题 1 的原因是您正在覆盖 div 的 innerHTML，为什么“输入的单词是...”行没有出现

https://plnkr.co/edit/RN0yNxDAsTSQQeSvGYb9?p=info

window.onload = function() {
var word = "";
do {
    word = prompt ("Please enter a word of your choice");

     if(word !== null){

     var span = document.createElement("span");

          span.innerHTML = "Word entered is " + "\"" + word + "\"";

          document.getElementById("myDiv").appendChild(span);


          var ul = document.createElement("ul");

          var letter = "<ul>";

          for (var i = 0; i < word.length; i++){
              letter += word[i] + " = " + word.charCodeAt(i) + "<br>";
          }

          letter += "</ul>";


          ul.innerHTML = letter;

          document.getElementById("myDiv").appendChild(ul);
}

} 

while (word !== null);

}

【讨论】：