JavaScript - prompt() 中的多行文本框？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7255444/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JavaScript - multi-line textbox in prompt()?
提问by dpp
Is there anyway to make the textbox/input box in promptmultiline?
有没有办法在prompt多行中制作文本框/输入框？
采纳答案by Wladimir Palant
No, browsers only allow single-line input for prompt(). However, with a simple change to the jQuery Alert Dialogslibrary you could get multi-line input there. Take jquery.alerts.js, look for <input type="text" size="30" id="popup_prompt" />and replace it by <textarea rows="5" cols="30" id="popup_prompt"></textarea>. That should do to have a multi-line input field show up when calling jPrompt().
不，浏览器只允许prompt(). 但是，通过对jQuery Alert Dialogs库的简单更改，您可以获得多行输入。Take jquery.alerts.js，寻找<input type="text" size="30" id="popup_prompt" />并替换它<textarea rows="5" cols="30" id="popup_prompt"></textarea>。这应该可以在调用时显示多行输入字段jPrompt()。
Edit: As Mulletfingers999 points out in a comment, jQuery Alert Dialogs have been deprecated in favor of jQuery UI dialogs. There you can also show a "modal" dialog, that dialog can have arbitrary content however - meaning that a <textarea>tag is possible if you want multi-line input.
编辑：正如 Mulletfingers999 在评论中指出的那样，jQuery Alert Dialogs 已被弃用，而支持jQuery UI 对话框。在那里您还可以显示一个“模态”对话框，但是该对话框可以具有任意内容 - 这意味着<textarea>如果您想要多行输入，则可以使用标签。
回答by Alex
Use \n encased in double quotes ("\n")
使用双引号 ("\n") 括起来的 \n
prompt("This\nis\nmultiline");
回答by HostileFork says dont trust SE
For pretty much any user-facing web application these days, you're going to want to avoid using clunky old dialogs like alert()and prompt(). Almost any library you're using should have a much better answer. jquery would be fine as others have said. It would also be good to think of how you might eliminate a need for modality by designing a more clever interface.
对于如今几乎所有面向用户的 Web 应用程序，您都希望避免使用像alert()和这样笨拙的旧对话框prompt()。几乎您使用的任何库都应该有更好的答案。正如其他人所说，jquery 会很好。考虑如何通过设计更聪明的界面来消除对模态的需求也是很好的。
"Interestingly", in Firefox they are already using XUL and reinventing a lot of user interface based on that (instead of relying on the "common dialogs" of the underlying OS). There's a template for modal dialogs in /source/toolkit/components/prompts/content/tabprompts.xml:
“有趣的是”，在 Firefox 中，他们已经在使用 XUL 并在此基础上重新发明了很多用户界面（而不是依赖于底层操作系统的“通用对话框”）。在/source/toolkit/components/prompts/content/tabprompts.xml 中有一个模态对话框模板：
<vbox anonid="infoContainer" align="center" pack="center" flex="1">
<description anonid="info.title" class="info.title" hidden="true" />
<description anonid="info.body" class="info.body"/>
</vbox>
<row anonid="loginContainer" hidden="true" align="center">
<label anonid="loginLabel" value="&editfield0.label;" control="loginTextbox"/>
<textbox anonid="loginTextbox"/>
</row>
<row anonid="password1Container" hidden="true" align="center">
<label anonid="password1Label" value="&editfield1.label;" control="password1Textbox"/>
<textbox anonid="password1Textbox" type="password"/>
</row>
<row anonid="checkboxContainer" hidden="true">
<spacer/>
<checkbox anonid="checkbox"/>
</row>
What they do is just hide the elements of the UI that they don't need. In the case of a call to prompt, they re-use the user name field and keep the password and checkbox elements hidden. You can see this happening in /source/toolkit/components/prompts/src/CommonDialog.jsm#52:
他们所做的只是隐藏他们不需要的 UI 元素。在调用 的情况下prompt，他们重新使用用户名字段并隐藏密码和复选框元素。您可以在/source/toolkit/components/prompts/src/CommonDialog.jsm#52 中看到这种情况：
case "prompt":
this.numButtons = 2;
this.iconClass = ["question-icon"];
this.soundID = Ci.nsISound.EVENT_PROMPT_DIALOG_OPEN;
this.initTextbox("login", this.args.value);
// Clear the label, since this isn't really a username prompt.
this.ui.loginLabel.setAttribute("value", "");
break;
Since it's more or less HTML, the only question is what the non-standard tag <textbox>means for the user interface. The XUL controls documentation informs us that it's only a one-line entry, you would need <textarea>for more:
由于它或多或少是 HTML，唯一的问题是非标准标签<textbox>对用户界面意味着什么。XUL 控件文档告诉我们它只是一个单行条目，您需要<textarea>更多：
https://developer.mozilla.org/en/XUL_controls
https://developer.mozilla.org/en/XUL_controls
I thought it would be "fun" to look at the implementation in Chromium on top of GTK too. After a bit of digging through the circuitous wrappers of WebKit, I did manage to find chromium/src/chrome/browser/ui/gtk/js_modal_dialog_gtk.cc, specifically this part:
我认为在 GTK 之上查看 Chromium 中的实现也会“有趣”。在对 WebKit 的迂回包装进行了一番挖掘之后，我确实找到了chromium/src/chrome/browser/ui/gtk/js_modal_dialog_gtk.cc，特别是这部分：
// Adjust content area as needed. Set up the prompt text entry or
// suppression check box.
if (ui::MessageBoxFlags::kIsJavascriptPrompt == dialog_->dialog_flags()) {
GtkWidget* content_area =
gtk_dialog_get_content_area(GTK_DIALOG(gtk_dialog_));
GtkWidget* text_box = gtk_entry_new();
gtk_entry_set_text(GTK_ENTRY(text_box),
UTF16ToUTF8(dialog_->default_prompt_text()).c_str());
gtk_box_pack_start(GTK_BOX(content_area), text_box, TRUE, TRUE, 0);
g_object_set_data(G_OBJECT(gtk_dialog_), kPromptTextId, text_box);
gtk_entry_set_activates_default(GTK_ENTRY(text_box), TRUE);
}
The text_box is created with gtk_entry_new()and the GTK documentationstates that GtkEntryis "A single line text entry field". For multi-line entry you would have to use GtkTextView:
该text_box与创建gtk_entry_new()和GTK文档指出GtkEntry是“单行文本输入栏”。对于多行条目，您必须使用GtkTextView：
http://developer.gnome.org/gtk/2.24/GtkTextView.html
http://developer.gnome.org/gtk/2.24/GtkTextView.html
So there's your answer not just of "can you?" but the smoking guns of why you can't (in a couple of popular browser implementations.) Unless there's a way to override that XUL in Firefox with an extension of some kind, which there may well be! I'll leave it as an exercise for the reader. :P
所以你的答案不仅仅是“你能吗？” 但是为什么不能（在一些流行的浏览器实现中）的吸烟枪。除非有一种方法可以使用某种扩展覆盖 Firefox 中的 XUL，这很可能存在！我将把它留给读者作为练习。:P
