Действие по нажатию на текст из alert

@SnapSh0t · Регистрация: 21.09.2013

Студворк — интернет-сервис помощи студентам

Здравствуйте!

Подскажите пожалуйста как реализовать такой скрипт, что он должен при нажатии на переменную login в alert запрашивать пользователя о смене ника?

JavaScript
1
2
3
4
5
6
var login = prompt('Введите имя пользователя!', '');
if (login == null) {
alert('Здравствуйте! Было приятно с Вами познакомиться.');
} else {
alert('Здравствуйте, ' + login + '!'); 
}

alert('Здравствуйте, ' + login + '!'); <- в этой строке если нажать ЛКМ на login, запросить: "Вы хотите изменить имя пользователя?".

@kalabuni · 13.03.2015, 18:31

никакие события на модальном окне, которое показывается при вызове метода alert () (а также confirm () и prompt ()), программно обработать нельзя

никак нельзя
ни в каком браузере
ни на чистом яваскрипте, ни с помощью любой из существующих js-библиотек

модальные окна реагируют только на клик по находящимся в них кнопкам (ну и в окошке метода prompt () можно ввести текст в поле ввода)

так что придумывайте иной подход,
например, используя вместо alert () всплывающий контейнер

@SnapSh0t · 13.03.2015, 18:50 **[ТС]**

А как реализовать такое задание:
Создайте сценарий JS, который при загрузке документа будет вызывать окно, запрашивающее имя пользователя.
Введенное имя сохранить в переменной name.
Выведите на страницу приветствие вида "Здравствуйте, name!". Если имя не введено, написать "Здравствуйте, Было приятно познакомиться".
При щелчке ЛКМ на приветствие должно появиться окно confirm, в котором содержится вопрос "Вы хотите изменить имя пользователя?", Если ответ да, то вновь вызвать окно запроса имени и соответсвтвующим образом изменить имя пользователя на странице.

Дело в том, что мы проходили только alert, propmt, onclick. И замудренного не учили больше, поэтому реализовать пытался так, ничего сущного не смог найти, скажите как можно реализовать данный скрипт?

@BANO · 13.03.2015, 20:39

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
(function (window,document) {
    window.UserInput = document.createElement('div');
    UserInput.setAttribute('style', "position: fixed;top: " + window.innerHeight / 2 + "px;border-radius : 10px;padding: 10px;left:" + window.innerWidth / 2 + "px;background: red;")
 
    UserInput.innerHTML = "Введите имя: <input type='search' onkeydown='UserIn(event)' id='UserIn'>";
    document.body.appendChild(UserInput);
})(window,document);
function UserIn(e) {
    if(e.keyCode==13){
        window.user=e.target.value||'приятно было познакомится';
        UserShow()
        UserInput.setAttribute('oncontextmenu', 'UserChange();return false;');
    }
}
function UserChange() {
    user=prompt('Вы хотите изменить имя') || 'приятно было познакомится';
    UserShow()
}
function UserShow() {
    if(typeof user == 'string'){
        UserInput.innerHTML='Здравствуйте, '+user+'!';
    }
}

это всё ставишь в конце страницы

@SnapSh0t · 13.03.2015, 20:48 **[ТС]**

Спасибо) Но при нажатии на приветствие не вылезает окошко confirm для изменения имени(

Добавлено через 1 минуту
и этого мы вообще не проходили что самое обидно( Не засчитает, завтра спрошу преподавателя как реализовать. Попробует объяснить. Выложу сюда. Всем кто дал ответы СПАСИБО!)

@kalabuni · 14.03.2015, 01:18

а про alert () в задании ничего нет -- это вы сами придумали
как я понимаю, приветствие "Здравствуйте, Было приятно познакомиться" должно быть написано прямо на странице, и вот когда клиент кликнет ЛКМ по этому приветствию на странице, и должно появиться окошко confirm ()

так что всё просто

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=windows-1251">
<title></title>
<script>
function prinT ()
{
var txt = prompt ('Введите ваше имя', '');
if (txt) txt = ', ' + txt; else txt = '';
document.write ('<u');
if (!txt) document.write (' onclick="if (confirm (\'Вы хотите изменить имя пользователя?\')) prinT ()"');
document.write ('>');
document.write ('Здравствуйте' + txt + '. Было приятно познакомиться</u>');
}
prinT ();
</script>
</head>
<body>
 
</body>
</html>

@SnapSh0t · 14.03.2015, 06:03 **[ТС]**

Да, спасибо) так и нужно было сделать)

Добавлено через 3 минуты
Можно еще узнать, почему когда меняю ник, пропадает цвет фона и цвет текста? и все становится по дефолту?

@kalabuni · 14.03.2015, 12:19

Сообщение от SnapSh0t

Можно еще узнать, почему когда меняю ник, пропадает цвет фона и цвет текста? и все становится по дефолту?

метод document.write (что-то), который используется в функции prinT () в двух разных случаях работает по-разному

на ещё НЕсформированной странице этот метод ДОПИСЫВАЕТ к тому, что имеется на странице, это самое что-то
а вот когда страница уже сформировалась, метод document.write (что-то) полностью ПЕРЕПИСЫВАЕТ страницу, заменяя всё, что на ней имеется, на что-то

при первом запуске (см. строку #16 кода) функции prinT () ваша страница ещё не сформирована и поэтому текст "Здравствуйте..." дописывается на страницу, не трогая всего остального на странице и после этого формирование страницы завершено
а вот при втором вызове (см. строку #12 кода) функции prinT () новый текст "Здравствуйте..." становится единственным на странице, всё остальное, включая фоны и цвета текста, уничтожается

поэтому использовать метод document.write () на уже сформированных страницах нельзя
динамически изменять уже сформированные страницы надо DOM-методами (например, менять содержимое тегов через свойство innerHTML)... но этого вы ещё явно не проходили

так что... лучше всего уберите ваши фоны и цвета текста, изначально сделайте всё по дефолту

@SnapSh0t · 14.03.2015, 14:13 **[ТС]**

Спасибо) Все понял)

@Eva Rosalene · 14.03.2015, 15:33

Сообщение от kalabuni

менять содержимое тегов через свойство innerHTML

А ещё лучше, не использовать запись в свойства, приводящие к парсингу HTML-кода, а работать через

JavaScript
1
node1.appendChild(DOMElement);

и подобные. Заодно не слетают слушатели ивентов и связи с кодом, если были настроены.

@kalabuni · 14.03.2015, 15:59

FraidZZ,
Джон Резиг (автор любимой здесь многими js-библиотеки Query) когда-то писал, что innerHTML работает значительно быстрее любого другого DOM-метода... так что... если важна скорость рендеринга изменений на странице, то этот метод - самое то

разумеется, для задачи ТС скорость вовсе непринципиальна... но я не к нему и обращаюсь

@Eva Rosalene · 14.03.2015, 17:25

Не по теме:

kalabuni, а речь таки шла не о скорости, а об эффекте - innerHTML перезаписывает элемент, в котором его изменили.

А DOM-методы скорее хирургическое вмешательство, не рушащее структуру - представьте, что у Вас в скрипте есть биндинги к отдельным элементам именно как к объектам HTMLElement, а не их селекторам - тогда и появляется необходимость в подобных манипуляциях...

Добавлено через 22 минуты

Сообщение от kalabuni

innerHTML работает значительно быстрее любого другого DOM-метода...

Не поверил сначала, и был относительно прав. Впрочем, innerHTML можно добавить одним скопом за раз - возможно, это окажется сопоставимо по скорости с прямым вызовом appendChild.

Тест:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<html>
    <head>
        <title>innerHTML += vs appendChild</title>
        <script>
            window.addEventListener("load", function (){
                var iHTMLstarted = new Date();
                for (var i = 0; i < 1e3; ++i) document.body.innerHTML += "<p></p>";
                var iHTMLfinished = new Date();
                
                document.body.innerHTML = "";
                
                var apChildStarted = new Date();
                for (var i = 0; i < 1e5; ++i) document.body.appendChild(document.createElement("p"));
                var apChildFinished = new Date();
                
                document.body.innerHTML = "";
                document.body.style.display = "";
                
                document.body.appendChild(document.createTextNode("innerHTML changing 1e3 times: " + (iHTMLfinished - iHTMLstarted) + "ms, ~" + ((iHTMLfinished - iHTMLstarted)/1e3) + "ms per change"));
                document.body.appendChild(document.createElement("br"));
                document.body.appendChild(document.createTextNode("appendChild changing 1e5 times: " + (apChildFinished - apChildStarted) + "ms, ~" + ((apChildFinished - apChildStarted)/1e5) + "ms per change"));
            }, false)
        </script>
    </head>
    <body style="display: none">
    </body>
</html>

Результат:

innerHTML changing 1e3 times: 695ms, ~0.695ms per change
appendChild changing 1e5 times: 155ms, ~0.00155ms per change

Как видите, весовые категории разные на два порядка с хвостиком :)

@kalabuni · 14.03.2015, 18:10

вы неправы -- перечитайте:
-- во-первых, я лишь цитировал утверждение Джона Резига, а вы своим цитированием приписали его слова лично мне
-- во-вторых, писал я не о скорости исполнения кода, а о скорости рендеринга изменений на странице, т.е. сравнивал время, которое пройдет после исполнения команды до момента, когда это изменение реально будет видно на странице

попробуйте написать простейший скрипт для проверки: кнопка и два контейнера
клик по кнопке запускает функцию, которая:
1) очищает оба контейнера
2) помещает в оба контейнера новый, и одинаковый HTML-код
при этом в первом контейнере удаление и создание происходит путём изменения значения свойства innerHTML контейнера
а во втором контейнере существующий HTML-код удаляется методом removeNode (), а новый HTML-код создаётся методами createElement () и createTextNode (), который потом помещается в контейнер методом appendChild ()

когда напишете, отключите интернет, очистите компьютер и его оперативку так, чтобы в диспетчере задач запускался только браузер и какая-то программа для записи видео с экрана типа бандикама (и минимум служебных программ Windows)

нажимая несколько десятков раз кнопку, запишите происходящее в видеофайл, а потом обработайте этот файл в каком-нить видеоредакторе с целью выявить - в каком из контейнеров стабильно раньше появляется новый HTML-код, а в каком - стабильно позже

я этим как-то занимался, нужда заставила... но результаты эксперимента получил противоречивые, потому я слова Резига лишь цитирую, но не утверждаю это лично

@BANO · 19.03.2015, 14:25

FraidZZ,
я почти так и сделал
сначала создал "свой" alert
а потом делал что захочится)

Новые блоги и статьи Все статьи Все блоги /
Символические и жёсткие ссылки в Linux. algri14 15.03.2026 Существует два типа ссылок — символические и жёсткие. Ссылка в Linux — это дополнительная запись в каталоге, которая может указывать либо на inode «файла-ИСТОЧНИКА», тогда это будет «жёсткая. . .	[Owen Logic] Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ФедосеевПавел 14.03.2026 Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ВВЕДЕНИЕ Выполняя задание на управление насосной группой заполнения резервуара,. . .	делаю науч статью по влиянию грибов на сукцессию anaschu 13.03.2026 прикрепляю статью	SDL3 для Desktop (MinGW): Создаём пустое окно с нуля для 2D-графики на SDL3, Си и C++ 8Observer8 10.03.2026 Содержание блога Финальные проекты на Си и на C++: hello-sdl3-c. zip hello-sdl3-cpp. zip Результат:
Установка CMake и MinGW 13.1 для сборки С и C++ приложений из консоли и из Qt Creator в EXE 8Observer8 10.03.2026 Содержание блога MinGW - это коллекция инструментов для сборки приложений в EXE. CMake - это система сборки приложений. Здесь описаны базовые шаги для старта программирования с помощью CMake и. . .	Как дизайн сайта влияет на конверсию: 7 решений, которые реально повышают заявки Neotwalker 08.03.2026 Многие до сих пор воспринимают дизайн сайта как “красивую оболочку”. На практике всё иначе: дизайн напрямую влияет на то, оставит человек заявку или уйдёт через несколько секунд. Даже если у вас. . .	Модульная разработка через nuget packages DevAlt 07.03.2026 Сложившийся в . Net-среде способ разработки чаще всего предполагает монорепозиторий в котором находятся все исходники. При создании нового решения, мы просто добавляем нужные проекты и имеем. . .	Модульный подход на примере F# DevAlt 06.03.2026 В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	13.03.2015, 18:31
	никакие события на модальном окне, которое показывается при вызове метода alert () (а также confirm () и prompt ()), программно обработать нельзя никак нельзя ни в каком браузере ни на чистом яваскрипте, ни с помощью любой из существующих js-библиотек модальные окна реагируют только на клик по находящимся в них кнопкам (ну и в окошке метода prompt () можно ввести текст в поле ввода) так что придумывайте иной подход, например, используя вместо alert () всплывающий контейнер 1

@SnapSh0t 0 / 0 / 0 Регистрация: 21.09.2013 Сообщений: 18
	13.03.2015, 18:50 [ТС]
	А как реализовать такое задание: Создайте сценарий JS, который при загрузке документа будет вызывать окно, запрашивающее имя пользователя. Введенное имя сохранить в переменной name. Выведите на страницу приветствие вида "Здравствуйте, name!". Если имя не введено, написать "Здравствуйте, Было приятно познакомиться". При щелчке ЛКМ на приветствие должно появиться окно confirm, в котором содержится вопрос "Вы хотите изменить имя пользователя?", Если ответ да, то вновь вызвать окно запроса имени и соответсвтвующим образом изменить имя пользователя на странице. Дело в том, что мы проходили только alert, propmt, onclick. И замудренного не учили больше, поэтому реализовать пытался так, ничего сущного не смог найти, скажите как можно реализовать данный скрипт? 0

@SnapSh0t 0 / 0 / 0 Регистрация: 21.09.2013 Сообщений: 18
	13.03.2015, 20:48 [ТС]
	Спасибо) Но при нажатии на приветствие не вылезает окошко confirm для изменения имени( Добавлено через 1 минуту и этого мы вообще не проходили что самое обидно( Не засчитает, завтра спрошу преподавателя как реализовать. Попробует объяснить. Выложу сюда. Всем кто дал ответы СПАСИБО!) 0

@SnapSh0t 0 / 0 / 0 Регистрация: 21.09.2013 Сообщений: 18
	14.03.2015, 06:03 [ТС]
	Да, спасибо) так и нужно было сделать) Добавлено через 3 минуты Можно еще узнать, почему когда меняю ник, пропадает цвет фона и цвет текста? и все становится по дефолту? 0

@SnapSh0t 0 / 0 / 0 Регистрация: 21.09.2013 Сообщений: 18
	14.03.2015, 14:13 [ТС]
	Спасибо) Все понял) 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	14.03.2015, 15:59
	FraidZZ, Джон Резиг (автор любимой здесь многими js-библиотеки Query) когда-то писал, что innerHTML работает значительно быстрее любого другого DOM-метода... так что... если важна скорость рендеринга изменений на странице, то этот метод - самое то разумеется, для задачи ТС скорость вовсе непринципиальна... но я не к нему и обращаюсь 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	14.03.2015, 18:10
	вы неправы -- перечитайте: -- во-первых, я лишь цитировал утверждение Джона Резига, а вы своим цитированием приписали его слова лично мне -- во-вторых, писал я не о скорости исполнения кода, а о скорости рендеринга изменений на странице, т.е. сравнивал время, которое пройдет после исполнения команды до момента, когда это изменение реально будет видно на странице попробуйте написать простейший скрипт для проверки: кнопка и два контейнера клик по кнопке запускает функцию, которая: 1) очищает оба контейнера 2) помещает в оба контейнера новый, и одинаковый HTML-код при этом в первом контейнере удаление и создание происходит путём изменения значения свойства innerHTML контейнера а во втором контейнере существующий HTML-код удаляется методом removeNode (), а новый HTML-код создаётся методами createElement () и createTextNode (), который потом помещается в контейнер методом appendChild () когда напишете, отключите интернет, очистите компьютер и его оперативку так, чтобы в диспетчере задач запускался только браузер и какая-то программа для записи видео с экрана типа бандикама (и минимум служебных программ Windows) нажимая несколько десятков раз кнопку, запишите происходящее в видеофайл, а потом обработайте этот файл в каком-нить видеоредакторе с целью выявить - в каком из контейнеров стабильно раньше появляется новый HTML-код, а в каком - стабильно позже я этим как-то занимался, нужда заставила... но результаты эксперимента получил противоречивые, потому я слова Резига лишь цитирую, но не утверждаю это лично 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	19.03.2015, 14:25
	*FraidZZ,* я почти так и сделал сначала создал "свой" alert а потом делал что захочится) 0

Действие по нажатию на текст из alert

Решение