Как совместить две функции 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();
Конечно, вы можете продлить это при необходимости.