Уничтожьте загруженную страницу ajax и скройте div

Question

Я использую .on() с jQuery для отображения div и .load() для загрузки в конкретном div с веб-страницы на моем сервере.

Как мне закрыть этот div, когда я нажимаю на div и уничтожаю его в DOM, чтобы он не загружался несколько раз?

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

Я пробовал с .off():

  if ($(window).width() > 500) { 
      // 
      $('.marketSelector',this.$element).on('click', function(e){ 
       e.preventDefault(); 
       var testMarketSelector = $('.testMarketSelector'); 
       testMarketSelector.css({ 
        'display': 'block' 
       }); 
       testMarketSelector.load("/frontend/MarketSelector.html .MarketSelector"); 
       testMarketSelector.off("click", function(){ 
        testMarketSelector.css({ 
         'display': 'none' 
        }); 
       }); 
      }); 
     } 

Я также попытался .one():

 if ($(window).width() > 500) { 
      // 
      $('.marketSelector',this.$element).one('click', function(e){ 
       e.preventDefault(); 
       var testMarketSelector = $('.testMarketSelector'); 
       testMarketSelector.css({ 
        'display': 'block' 
       }); 
       testMarketSelector.load("/frontend/MarketSelector.html .MarketSelector"); 
      }); 
     } 

Answer 1

Изменить событие следующим образом:

$('.marketSelector', this.$element).one('click', function (e) { ... }); 

Уничтожить div, как только вы нажмете на элемент, вы можете использовать плагин, например outerclick или добавить новое событие в тело.

Append это событие слушателя при открытии Dialog:

var $marketingDialog = this.$element; 
$("body").on("click.outer",function(event){ 
// User did not clicked inside of the dialog 
if(!$marketingDialog.parents($(event.target)).length){ 
    $marketingDialog.fadeOut(); 
    $marketingDialog.remove(); 
    $("body").off("click.outer"); 
    } 
}); 

Answer 2

testMarketSelector.load(...); API имеет обработчик успеха; звоните testMarketSelector.off("click", ...) в обработчик успеха load(). Кроме того, IIRC, есть проблемы, если API-интерфейс load() сам загружает jquery как часть страницы загрузки (кажется, jquery со страницы, загружаемой в DIV, переопределяет родительскую страницу jquery).