Окно подтверждения JavaScript с пользовательскими кнопками - PullRequest
10 голосов
/ 20 октября 2010

Могу ли я написать пользовательское поле подтверждения в JavaScript, которое вместо кнопок по умолчанию OK и CANCEL показывает кнопки SAVE и DELETE?

Ответы [ 3 ]

14 голосов
/ 20 октября 2010

Используйте для этого диалоговое окно jQuery UI .

. Вы можете сделать что-то вроде этого:

$(function() {
  $("#dialog-confirm").dialog({
    resizable: false,
    height: "auto",
    width: 400,
    modal: true,
    buttons: {
      "Do it": function() {
        $(this).dialog("close");
      },
      Cancel: function() {
        $(this).dialog("close");
      }
    }
  });
});
<link href="https://jqueryui.com/jquery-wp-content/themes/jquery/css/base.css" rel="stylesheet"/>
  
<link href="http://jqueryui.com/jquery-wp-content/themes/jqueryui.com/style.css" rel="stylesheet" />

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>



<div id="dialog-confirm" title="Is it treason, then?">
  <p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>Am I the Senate?</p>
</div>
5 голосов
/ 20 октября 2010

Не с собственным окном подтверждения JavaScript.Вы могли бы использовать один из многих компонентов JavaScript UI, которые эмулируют модальные диалоги, чтобы сделать это вместо этого.

Вот пример: http://jqueryui.com/demos/dialog/modal-confirmation.html

Я никогда не использовал это, поэтому используйте на свой страх и риск.

3 голосов
/ 20 октября 2010
$('confirm text').dialog(
    {
        modal:true, //Not necessary but dims the page background
        buttons:{
            'Save':function() {
                //Whatever code you want to run when the user clicks save goes here
             },
             'Delete':function() {
                 //Code for delete goes here
              }
        }
    }
);

Это должно работать, но вам нужно будет скачать или связать jQuery и библиотеки jQuery UI, чтобы запустить это.

...