Поддержание элементов сценария независимо

Краткая версия: Как сохранить содержимое разных элементов <script> независимо друг от друга?Поддержание элементов сценария независимо

Длинная версия: У меня есть шаблон Джанго, который выглядит немного как это:

<div class="app-container"> 
    <script src="app.js"></script> 
    <script> 
    $(function() { 
     app_init($('.app-container')); // app_init is defined in app.ja 
    }); 
    </script> 
</div>

Трудность состоит в том, что я хочу, чтобы иметь возможность включить этот шаблон несколько раз в одной и той же странице. Когда я это делаю, селектор $('.app-container') соответствует всем элементам <div class="app-container"> на странице.

Каков наилучший способ сохранить эти независимые? Некоторые опции я могу думать, но не совсем понимают, как заставить их работать:

Найти <div ...> тега, который является родителем <script> тега. Если сценарий был выполнен автоматически, я могу увидеть, как это будет работать, используя document.scripts[-1], но я не могу определить, как это сделать, когда код выполняется в $(function() { ... }).
Назначить класс тега <div> программным путем, а затем программно определить тот же класс в javascript. Но я не могу понять, как это сделать.
Что-то умное, используя анонимные функции, и фиксирует это, опять же, я не могу понять.

Редактировать Я видел людей, предлагая различные вариации этого:

<div class="app-container"> 
    <script> 
    var thisscript = document.currentScript; 
    $(function() { 
     app_init($(thisscript).closest('.app-container')); 
    }); 
    </script> 
</div>

Это не работает, если шаблон используется несколько раз на странице, как переменная thisscript общего между их всех, и поэтому он всегда является последним div.app-container на странице, которая обрабатывается.

источник

2015-05-25 Tom

Какова ваша конечная цель? Кажется, что ваш код делает то, что должен, но не то, что вы хотите. Чего вы пытаетесь достичь? Если вам нужны уникальные элементы, вы можете использовать идентификатор для каждого. – colecmc

Ну, в значительной степени то, что говорится на олове. Я хочу, чтобы иметь возможность написать шаблон django, который включает некоторые теги html и некоторые скрипты, которые манипулируют этими тегами, без необходимости присваивать уникальный идентификатор тегам каждый раз при включении шаблона. Я мог просто потребовать, чтобы пользователь добавлял параметр edtra 'unique_id' каждый раз, когда они включали шаблон, но это раздражает, терпит неудачу, если они забывают это сделать, и похоже, что это должно быть ненужным - я должен иметь возможность получить ссылку на тег 'div', который включает * этот * тег скрипта. – Tom

Вот техника, которая может работать. Вам придется выяснить проблему глобальной переменной.

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script> 
 
    <meta charset="utf-8"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<script> 
 
    var thisScript = []; 
 
</script> 
 

 
<body> 
 

 
    <div class="app-container"> 
 
    some text 
 
    <p>one</p> 
 
    <script src="app.js"></script> 
 
    <script> 
 
     thisScript.push(document.currentScript); 
 
     console.log(1); 
 
     $(function() { 
 
     //app_init($('.app-container')); // app_init is defined in app.js 
 
     }); 
 
    </script> 
 
    </div> 
 

 
    <div class="app-container"> 
 
    second instance 
 
    <p>two</p> 
 
    <script src="appy.js"></script> 
 
    <script> 
 
     thisScript.push(document.currentScript); 
 
     console.log(2); 
 
     $(function() { 
 
     //alert(script); 
 
     //app_init(script); // app_init is defined in app.js 
 
     }); 
 
    </script> 
 
    </div> 
 

 
    <div class="app-container"> 
 
    here is poor html 
 
    <p>last</p> 
 
    <script src="appy.js"></script> 
 
    <script> 
 
     thisScript.push(document.currentScript); 
 
     console.log(3); 
 
     $(function() { 
 
     /**/ 
 
     }); 
 
    </script> 
 
    </div> 
 

 
    <script> 
 
    console.log(thisScript); 
 
    </script> 
 
</body> 
 

 
</html>

Кроме того, увидеть этот пост для более вариантов, которые могут работать в вашем случае: How may I reference the script tag that loaded the currently-executing script?

источник

2015-05-25 05:01:45 colecmc

См. Обновления к вопросу; это работает только один раз в документе, а не в том случае, если один и тот же шаблон используется несколько раз. Проблема «глобальных переменных» действительно является проблемой. – Tom

Я не знаком с джанго. Как добавить шаблоны? – colecmc

Система шаблонов Django позволяет добавить другой шаблон - '{% include 'other_template.html'%}', если это помогает. Во всяком случае, джанго - это отвлечение.Проблема заключается в том, как сохранить ссылку на текущий скрипт, чтобы он мог использоваться в функции onReady документа таким образом, который можно повторить на одной странице. – Tom

Поддержание элементов сценария независимо

ответ

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