2016-06-13 2 views
1

У меня есть динамический контейнер, который обновляется при нажатии ссылок путем загрузки в имени файла из атрибута «data-target». Я не хочу, чтобы одна и та же ссылка дважды была нажата (эффективно дважды загружалась одна и та же страница).Не загружайте один и тот же загрузочный файл JQuery дважды

Есть ли способ предотвратить это?

JQuery:

$(document).ready(function(){ 
    // Set trigger and container variables 
    var trigger = $('#nav ul li a'), 
     container = $('#ajaxContainer'); 

    // Fire on click 
    trigger.on('click', function(){ 
     // Set $this for re-use. Set target from data attribute 
     var $this = $(this), 
      target = $this.data('target'); 

     // Load target page into container 
     container.load(target); 

     console.log(target); 

     // Stop normal link behavior 
     return false; 
    }); 
}); 

HTML:

<DOCTYPE html> 
<html> 
<head> 
    <title>My Site</title> 
    <link rel="stylesheet" type="text/css" href="/css/main.css" /> 
</head> 
<body> 
    <nav id="nav"> 
    <ul> 
     <li><a href="#" data-target="/home.php">Home</a></li> 
     <li><a href="#" data-target="/modules/Movies/index.php">Movies</a></li> 
    </ul> 
    </nav> 
    <div id="ajaxContainer"> 
    <img id="logo" src="/images/logo.png" /> 
    <?php include('home.php'); ?> 
    </div> 

    <script src="/js/jquery-1.12.4.min.js"></script> 
    <script src="/js/app.js"></script> 
</body> 
</html> 
+0

Каких файла вы загружаете? Это js, который должен быть загружен на страницу? – Roysh

+0

Загружается в файлы PHP, используя атрибут «data-target». – Madness

ответ

1

Вы можете удалить data-target и повторно установить его, когда load() завершается (по параметру обратного вызова):

// Fire on click 
trigger.on('click', function(){ 
    // Set $this for re-use. Set target from data attribute 
    var $this = $(this), 
     target = $this.data('target'); 
    $this.removeAttr('data-target'); // delete de target 

    // Load target page into container only if it's target set 
    if(target) { 
     container.load(target); 
    } 
    console.log(target); 

    // Stop normal link behavior 
    return false; 
}); 
+0

Вы можете вкратце увидеть, как атрибут исчезает и снова появляется, но на самом деле он не останавливает один и тот же файл от загрузки несколько раз. – Madness

+0

Этот код готов к загрузке один раз и когда он полностью загружается, он позволяет снова перезагрузить –

+0

Если вы хотите выполняйте только один раз до конца ресурса страницы, просто удалите функцию обратного вызова 'load() (сброс цели). –

Смежные вопросы