Лучший способ загрузить и выгрузить файл JS через JQuery - PullRequest
Новая
       10

Лучший способ загрузить и выгрузить файл JS через JQuery

3 голосов
/ 18 июля 2011

Я был в отчаянии, пытаясь найти лучший способ загрузки и выгрузки некоторых файлов JS через jQuery, это было последнее, что я могу сделать: 

  $("#button").live("click", function(){
    var pl = $(this).attr('rel');
    $.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'', function() {
       $('#container').load(""+ siteAddress +"load/"+ pl +"/");    
    });
  });

Что я хочу сделать, это загрузить некоторыестраница через jQuery, и в то же время он будет включать соответствующий внешний файл JS для текущей загруженной страницы, он работает нормально в первый раз, но когда я нажимаю кнопку еще раз, последний JS все еще загружен, поэтому он вызовет функциювнутри JS-файла дважды для одной и той же страницы.

Я пытался использовать .append, также путем изменения атрибута <script> и создания элемента динамически <script>, но все же, все, что я получил, это тот же результат.

Ответы [ 2 ]

5 голосов
/ 18 июля 2011

Вы не можете "выгрузить" JavaScript.Как только он загружен, он загружен.Там нет отмены.

Однако вы можете отсоединить обработчики событий.См .: http://api.jquery.com/unbind/

live() - это особый случай для unbind().Живые обработчики событий присоединяются к document, а не к элементу, поэтому вы должны удалить обработчик следующим образом: 

$(document).unbind('click');

Однако это, вероятно, удалит больше обработчиков, чем только тот, о котором идет речьможет выполнять одно из двух действий: 1) назвать функцию-обработчик или 2) создать пространство имен.

функция обработчика имен 

function myClickHandler(){
    var pl = $(this).attr('rel');
    $.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'', function() {
       $('#container').load(""+ siteAddress +"load/"+ pl +"/");    
    });
}

$("#button").live("click", myClickHandler);

// And later ...

$(document).unbind('click', myClickHandler);

пространство имен 

$("#button").live("click.myNamespace", function(){
    var pl = $(this).attr('rel');
    $.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'', function() {
       $('#container').load(""+ siteAddress +"load/"+ pl +"/");    
    });
});

// And later...

$(document).unbind('click.myNamespace');

ОБНОВЛЕНИЕ:

Как @RTPMatt упоминает ниже, die() на самом деле более уместно.Описанный выше метод будет работать, но die() проще в использовании.Однако, с die() вы должны точно подобрать селектор к тому, который использовался при вызове live(), иначе результаты могут быть непредсказуемыми: 

$("#button").live("click", function(){
    var pl = $(this).attr('rel');
    $.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'', function() {
       $('#container').load(""+ siteAddress +"load/"+ pl +"/");    
    });
});

// And later ...

$('#button').die('click');
0 голосов
/ 13 июня 2012

Вы могли бы даже иметь «функцию-заполнитель» и проверить ее существование, прежде чем загружать скрипт снова.Но, во-первых, я думаю, что было бы лучше загрузить страницу и только после загрузки внешнего скрипта (и только если это необходимо) 

$("#button").live("click", function()
{
  var pl = $(this).attr('rel');
  //now we load the page, and then the "complete" callback function runs
  $('#container').load(""+ siteAddress +"load/"+ pl +"/", function() 
  {
    we check if the function is present into memory
    if (typeof window["page_" + pl + "_init"] == 'undefined')
    {
      //function not found, we have to load the script
      $.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'');
    }
  });
});

Во внешний скрипт вам потребуется функция 

function page_abcde_init()
{
  //this is just a place holder, or could be the function used
  //to initialize the loaded script (sort of a document.ready)
}

Где «abcde» для «page_abcde_init ()» - это значение элемента, по которому щелкнули var pl = $(this).attr('rel');

...