Как мне написать свой собственный диалог подтверждения в JavaScript?

StackOverflow https://stackoverflow.com/questions/188691

  •  06-07-2019
  •  | 
  •  

Вопрос

Я хочу написать что-то, что действует так же, как verify () в javascript, но я хочу написать это сам, чтобы я мог обработать диалоговое окно. Из-за проблем с продумыванием того, как я в основном заставлю поток javascript ждать, пока пользователь ответит, а затем вернуть true или false.

Это было полезно?

Решение

На вашем месте я бы посмотрел одну из популярных библиотек javascript. Большинство из них содержат модальный диалог.

Я нашел пару для JQuery: jqModal и SimpleModal .

Когда вы создаете модальное диалоговое окно, вам нужно привязать события к кнопкам, чтобы вы делали что-то вроде: 

function askUserYesOrNo() {
  var myDialog = $('<div class="mydialog"><p>Yes or No?</p><input type="button" id="yes" value="Yes"/><input type="button" id="no" value="No"/></div>');
  $("#yes").click(handleYes);
  $("#no").click(handleNo);
  myDialog.modal(); //This would have to be replaced by whatever syntax the modal framework uses
}

function handleYes() {
  //handle yes...
}

function handleNo() {
  //handle no...
}

Другие советы

Вы действительно хотите использовать для этого фреймворк из-за множества странных кросс-браузерных проблем, с которыми вы столкнетесь, пытаясь создать его самостоятельно.

Я добился хороших результатов, используя jqModal , плагин для инфраструктуры jQuery, который позволяет определять модальные диалоги, но это ни в коем случае не единственный вариант; попробуйте поискать в Google jquery modal или yui modal для некоторых альтернатив.

Для Mootools есть moo.rd's Custom.Confirm и Windoo.Confirm для вашей справки.

Вы можете использовать окно. showModalDialog ( mozilla ), но это нестандартная функция, представленная Internet Explorer. Теперь это также поддерживается в Firefox 3 и Safari (я не уверен, какая версия, но как минимум 3.1 и выше, но не iPhone).

Модальный лайтбокс YUI с непокрытыми руками пример ):

http://bravo9.com/journal/a-simple-lightbox-modal-dialog-with-yui-c5b048f5-b278-46d1-9a7e-0d3035094f52/

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top