Как совместить две функции jQuery?

Первая функция (можно найти по адресу http://nadiana.com/jquery-confirm-plugin):

 $('#confirm').confirm(
{
    msg: 'You are about to delete gallery and all images related to that gallery. Are you sure?<br>',
    buttons: {
    separator: ' - '
    }
}
);

В основном это вопрос Да / Нет, и если вы ответите Да, он будет продолжен.

Вторая функция:

$(document).ready(function() {
    $('#load').hide();
});
$(function() {
    $(".delete").click(function() {
        $('#load').fadeIn();
        var commentContainer = $(this).parent();
        var id = $(this).attr("id");            
        var string = 'id='+ id ;

        $.ajax({   
            url: "<?php echo site_url('gallery/delete_image') ?>",
            type: "POST",
            data: string,
            cache: false,
            success: function(){
                commentContainer.slideUp('slow', function() {$(this).remove();});
                $('#load').fadeOut();
            }   
        });
        return false;
    });
});

Эта функция предназначена для удаления изображений. Как я могу совместить эти две функции? Сначала я хочу задать вопрос, и если нажать "Да", чтобы продолжить удаление.

2 ответа

Решение

Согласно документации, на которую вы ссылаетесь, вы просто используете один и тот же селектор как для своего действия, так и для подтверждения:

$(document).ready(function() {
    $('#load').hide();

    $(".delete").click(function() {
        $('#load').fadeIn();
        var commentContainer = $(this).parent();
        var id = $(this).attr("id");            
        var string = 'id='+ id ;

        $.ajax({   
            url: "<?php echo site_url('gallery/delete_image') ?>",
            type: "POST",
            data: string,
            cache: false,
            success: function(){
                commentContainer.slideUp('slow', function() {$(this).remove();});
                $('#load').fadeOut();
            }   
        });
        return false;
    });



    $('.delete').confirm(
    {
        msg: 'You are about to delete gallery and all images related to that gallery. Are you sure?<br>',
        buttons: {
        separator: ' - '
        }
    });
});

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

С сайта:

Проще говоря, он сохраняет копию всех обработчиков событий, связанных с элементом, связывает их и связывает себя вместо этого. Диалог подтверждения отображается, когда пользователь запускает действие. Если пользователь решает продолжить действие, он снова связывает обработчики и запускает событие. Если пользователь решает отменить действие, диалоговое окно исчезает.

Так что вам нужно сделать что-то вроде:

$('#delete').click(function(){ ... });
$('#delete').confirm();

Конечно, вы можете продлить это при необходимости.

Другие вопросы по тегам