JavaScript-многострочное текстовое поле в prompt()?

есть ли в любом случае, чтобы сделать текстовое поле/поле ввода в prompt многострочный?

8
javascript prompt

3 ответов

нет, браузеры разрешают только однострочный ввод для prompt(). Однако с простым изменением на диалоги оповещения jQuery библиотека вы можете получить многострочный вход там. Взять jquery.alerts.js искать <input type="text" size="30" id="popup_prompt" /> и заменить на <textarea rows="5" cols="30" id="popup_prompt"></textarea>. Это должно сделать, чтобы при вызове jPrompt().

редактировать: как указывает Mulletfingers999 в комментарии, диалоги jQuery Alert были устаревшими в пользу jQuery UI диалоги. Там вы также можете показать" модальный " диалог, который может иметь произвольное содержимое, однако-это означает, что <textarea> тег возможен, если вы хотите многострочный ввод.

8

для почти любого пользовательского веб-приложения в эти дни вы захотите избежать использования неуклюжих старых диалогов, таких как alert() и prompt(). Почти любая библиотека, которую вы используете, должна иметь гораздо лучший ответ. jquery будет в порядке, как говорили другие. Было бы также неплохо подумать о том, как вы могли бы устранить необходимость в модальности, разработав более умный интерфейс.

"интересно", В Firefox они уже используют XUL и изобретают много пользовательского интерфейса исходя из этого (вместо того, чтобы полагаться на "общие диалоги" базовой ОС). Существует шаблон для модальных диалогов в / источник / инструментарий / компоненты / подсказки / содержимое / 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>

что они делают-это просто скрыть элементы пользовательского интерфейса, которые им не нужны. В случае вызова prompt, они повторно используют поле имени пользователя и скрывают элементы пароля и флажка. Вы можете видеть, как это происходит в / источник / инструментарий / компоненты / подсказки / 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;

поскольку это более или менее HTML, единственный вопрос в том, что нестандартный тег <textbox> средства для пользовательского интерфейса. Документация XUL controls сообщает нам, что это только однострочная запись, вам понадобится <textarea> дополнительные:

https://developer.mozilla.org/en/XUL_controls

Я думал, что будет" весело " посмотреть на реализацию в Хром на вершине GTK тоже. Немного покопавшись в окольных обертках WebKit, мне удалось найти chromium/src/chrome/браузер/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);
}

text_box создается с помощью gtk_entry_new() и документация GTK утверждает, что GtkEntry is "однострочное поле ввода текста". Для многострочного ввода вам придется использовать GtkTextView:

http://developer.gnome.org/gtk/2.24/GtkTextView.html

Итак, есть ваш ответ не только "можете ли вы?"но дымящиеся пушки, почему вы не можете (в нескольких популярных реализациях браузера.) Если нет способа переопределить этот XUL в Firefox с каким-то расширением, которое вполне может быть! Я оставлю это упражнение для читателя. : P

2

используйте \n, заключенный в двойные кавычки ("\n")

prompt("This\nis\nmultiline");
1