Самый простой способ создать подтверждающее сообщение с помощью jQuery / JavaScript? - PullRequest
7 голосов
/ 04 декабря 2009

Как мне этого добиться?

  1. Пользователь нажимает ссылку удаления (с классом «подтверждения»).
  2. Появляется подтверждающее сообщение с вопросом "Вы уверены?" с опциями «Да» и «Отмена».

Если выбрано «да», ссылка будет продолжаться по нажатию, но если выбрано «Отмена», действие отменяется.

Обновление: Окончательный рабочий код с confirm() благодаря этому парню :

$('.confirm').click(function() {
    return confirm("Are you sure you want to delete this?");
});

Ответы [ 3 ]

17 голосов
/ 04 декабря 2009

Javascript предоставляет встроенный диалог подтверждения.

if (confirm("Are you sure?"))
{
    // continue with delete
}
2 голосов
/ 24 августа 2012

По моему опыту, это лучший и самый простой способ получить подтверждение!

<a href="#" onclick="return myconfirm()">Confirm</a>
<script>
function myconfirm()
{
    if(confirm('Are You Sure ...'))
        return true;
    return false;
}
</script>
0 голосов
/ 24 января 2012

Я успешно реализовал окно подтверждения в Jquery. прежде чем пытаться это сделать, убедитесь, что у вас есть библиотека Jquery и css INCLUDED (jquery-ui-1.8.16.custom.css, jquery-1.6.2.js, jquery-ui-1.8.16.custom.min. JS). ОСНОВНЫЕ РАЗЛИЧИЯ МЕЖДУ JAVASCRIPT ПОДТВЕРЖДАЮТ КОРОБКУ И ЭТУ КОРОБКУ, КОТОРЫЕ МЫ СОЗДАЕМ, ИСПОЛЬЗУЯ DIV - ЭТО - ПОДТВЕРЖДАЮ JAVASCRIPT ДЛЯ ВХОДА ПОЛЬЗОВАТЕЛЯ, ПОСЛЕ ПОЛЬЗОВАТЕЛЯ ВХОДЯТ ДА / НЕТ, СЛЕДУЮЩАЯ СЛЕДУЮЩАЯ СЛЕДУЮЩАЯ ЛИСТЬ БЛОК - ** СЛЕДУЮЩАЯ ЛИНИЯ КОДА ПОСЛЕ showConfirm () выполнится немедленно *, поэтому будьте осторожны

/** add this div to your html

* /

var $confirm;
var callBack;
var iconStyle = '<span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 50px 0;"></span>';
var messageStyleStart = '<span align="center" style="font-family:arial, verdana, sans-serif;font-size:9.3pt;">';
var messageStyleEnd = '</span>';


$(document).ready(function(){
    $('#confirmDialog').dialog({
            autoOpen: false,
            modal: true
    });


    //jquery confirm box -- the general alert box
    $confirm = $('<div  style="vertical-align:middle;"></div>')
    .html('This Message will be replaced!')
    .dialog({
        autoOpen: false,
        modal: true,
        position: 'top',
        height:300,
        width: 460,
        modal: true,
        buttons: {
            Ok   : function() {
                $( this ).dialog( "close" );
                if(null != callBack)
                    callBack.success();
            },
            Cancel: function() {
                $( this ).dialog( "close" );
                if(null != callBack)
                    callBack.fail();
            }
        }
    }); 

});

    function showConfirm(message,callBackMe,title){
    callBack = null;
    $confirm.html(""); // work around
    $confirm.html(iconStyle + messageStyleStart +message + messageStyleEnd);
    if(title =='undefined'|| null ==title)
        $confirm.dialog( "option", "title", "Please confirm" );
    else
        $confirm.dialog( "option", "title", title);
    var val = $confirm.dialog('open');
    callBack = callBackMe;
    // prevent the default action
    return true;
}

    // Now for calling the function 
// create a Javascript/jSOn callback object 

var callMeBack = {
                    success: function()
                            {   // call your yes function here                                  
                                clickedYes();
                                return;
                            },
                    fail: function (){
                                // call your 'no' function here
                                 clickedNo();
                                return ;
                            }
                };


    showConfirm("Do you want to Exit ?<br/>"+
                    ,callMeBack1,"Please Answer");
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...