提示用户输入信息，然后对数据进行排序答案

【问题标题】：Prompt user to input information, then sort the data提示用户输入信息，然后对数据进行排序
【发布时间】：2013-03-21 17:50:07
【问题描述】：

对于一个类项目，我需要用 Javascript 创建一个程序，要求用户输入 3 个名称，然后按字母顺序对名称进行排序并将它们打印在屏幕上。

我已经弄清楚如何创建一个提示框供用户输入数据，并且我可以让程序将用户输入的字符串打印到屏幕上。但是，我无法弄清楚如何让 Javascript 对字符串进行排序。我知道我需要使用一个数组，但我不确定将数组放在哪里，或者如何让它知道用户输入的变量。

这是我目前的代码：

<html>
<script> 

function disp_prompt() 
      {
      var names=prompt("Please enter three names","Names")
      document.getElementById("msg").innerHTML= names
      }

</script> 


<center><input type="button" onclick="disp_prompt()" value="Click Here"></center>
<br>

<h2><center><div id="msg"></div></center></h2>
</html>

【问题讨论】：

只有一个提示用户如何输入3个名字？
你试过什么？你知道如何处理字符串吗？提示：split、sort 和 join 函数

标签： javascript user-input command-prompt sorting

【解决方案1】：

整个事情可能看起来像

var namesToPrompt = 3,
    names         = [ ];

// as long as namesToPrompt is truthy, prompt for inputs
while( namesToPrompt-- ) {
    names.push( prompt('Please enter a name') );
}

// sort our array
names.sort( byName );

// and print it
document.getElementById( 'msg' ).textContent = names.join(',');

function byName( a, b ) {
    return a.localeCompare( b );
}

如果你想让用户一次输入所有名字，你可以这样

var inputNames = prompt( 'Please enter three names','Names' );

document.getElementById( 'msg' ).textContent = inputNames
                                                 .split( /,\s+/ )   // split by any amount of white-space characters in a row
                                                 .sort( byName )
                                                 .join( ',' );

function byName( a, b ) {
    return a.localeCompare( b );
}

【讨论】：

意外点击 xD 这基本上是我推荐的方式。不过，您可以在没有该功能的情况下执行.sort()。
我不建议让他们同时做这三个名字。仅仅因为他们可以输入 jeff,tim,tyler 或 jeff tim tyler 或 jeff, tim, tyler` 或任何其他随机案例，您必须考虑所有这些案例才能正常工作。你可以做.split(/\s|,|,\s)，但即使这样也可能不会涵盖所有的边缘情况。这也不允许使用全名，例如jeff shaver，因为它有一个空格。
@JeffShaver 有没有办法让提示框有三个输入框？还是只需要出现三个单独的提示框？如果是这样，我如何让程序从所有三个提示框中打印信息？我曾经让程序提示 3 个单独的框，但它只会打印最后一个框的输入。
@jAndy 出于某种原因，当我尝试您编写的代码时，它会提示 3 个输入框，但不会在页面上打印任何内容。
@AnnikaZwirn 任何复杂的对话框（如更多输入元素）都必须由您自己创建（html+css）或使用众多可用的 UI 框架之一。 prompt() 方法是一个非常简单、快速的脏元素。如果没有打印，请尝试使用.innerHTML 而不是.textContent，例如旧版 IE 浏览器不知道。