Jquery Jqui Модальное окно: открытие одного и того же модального несколько раз

Question

Я работаю над функцией javascript, которая открывает модальное окно jquery и выполняет вызов ajax для заполнения модального режима. Я включил идентификаторы "left" и "right" - щелчок по одному из них изменяет содержимое модального окна (прокрутка слайд-шоу с фотографиями).

Все отлично работает, кроме одной вещи: если я открою модальное, а затем закрою его, то, открывая его во второй раз, эти "левые / правые" кнопки будут считать каждый щелчок как два (нажмите "вправо" один раз, но переместите два изображения поверх), Если я закрою окно и снова открою его, счет снова увеличится на 1 (3 изменения за 1 клик).

Единственный обходной путь, который исправляет это, - перезагрузить страницу, когда модальное окно закрыто, но кто-нибудь знает о лучшем решении? По сути, я хочу "перезагрузить" модальное окно, но не хочу его разрушать - я хотел бы иметь возможность открывать / закрывать модальное окно несколько раз и работать с этими кнопками вправо / влево.

Часть функции, которую я использовал для создания этих кнопок, ниже - спасибо за любые предложения / идеи.

    function getNextImage(direction) {
        if(direction == 1) {
            if(imageNumber == 1) {
                    imageNumber = lastImage;
                } else {
                    --imageNumber;
                }
            }
        if(direction == 2) {
            if(imageNumber == lastImage) {
                    imageNumber = 1;
                } else {
                    ++imageNumber;
                }
            }
        if(direction == 0) {
            imageNumber = 1;
        }

        $.ajax({
            type: "GET",
            url: "phpIncludes/next_fetch.php",
            cache: false,
            data: {img : imageNumber, cap : imageNumber, width : dWidth, height : dHeight, a : album},
            success: function(htmlpic) {
                $("#left"+album).html(htmlpic);
            }
        });
    }

    $("#moveLeft"+album).click(function() {
        getNextImage(1);
        console.log("Image Number is: " + imageNumber);
    });

    $("#moveRight"+album).click(function() {
        getNextImage(2)
        console.log("Image Number is: " + imageNumber);
    });

Answer 1

В этой части::

$.ajax ({тип: "GET", URL: "phpInclude /next_fetch.php", кэш: false, данные: {img: imageNumber, cap: imageNumber, ширина: dWidth, высота: dHeight, a: album}, успех: function(htmlpic) { $("#left"+album).html(htmlpic); } });

перед тем, как добавить htmlpic в #left, proib сначала опустошит это содержимое #left и проверит, готово ли оно!!