Задача получить родителя скрипта.
Есть необходимость привязать методы к элементу в котором расположен скрипт. Некоторое время уже пытался такое написать но скрипт все еще не работает. Сложности тут вот какие. Так как jQuery начинает работать после полной загрузке всего в нутри его не получится выбрать номер нашего текущего скрипта. Это нужно делать в яваскрипте на этапе загрузки. Но потом как то полученный параметр нужно передать в сам жквери. Можно было бы использовать для этого какой то из общедоступных элементов, но какой опять же проблема. Думаю как то так делать.
<div> <!-- К этому элементу нужно прикрепить все мои события --> <script> $(function(){ $("body").data("script").parent().on("click", "a", function(){ alert("Клик"); }); }).find("body").data("script", $(document.scripts[document.scripts.length-1])) </script> <a>Нажимаем</a> </div> Если скрипт один такой на странице, все нормально. Но как только их больше одного, скрипты начинают друг другу мешать. Возможно как то еще удасться передать номер текущего скрипта в jQuery?. Я думал как то так сделать но у меня такая схема не заработала, может кто подскажет что делаю не правильно. Это был бы наверно идеальный вариант. Но заработать у меня ему не удалось. Что поменять сам плохо представляю. <div> <!-- К этому элементу нужно прикрепить все мои события --> <script> (function($, script){ $(script).parent().on("click", "a", function(){ alert("Клик"); }); })(jQuery, document.scripts[document.scripts.length-1]) </script> </div> |
Месье знает толк... Последний код рабочий, но в диве нет тега "a".
|
Цитата:
|
Цитата:
Для себя удобство подобной схемы обьясняю так. Мы рабоатет с элементами. Их вложенность постоянно учитывается в DOM дереве элементов. Так чем скрипт отличается от остальных? Плюс сама практика вешать события не на каждый элемент по отдельности а одно событие на родительский элемент также становится хорошей практикой. Так почему бы не иметь возможность просто закинуть скрипт в нужный элемент. Все события сами повиснут на тег в который мы закинули скрипт. Перевесить все события на элемент выше или ниже становится делом секунд. Никакие идентификаторы в скрипте кроме место его расположения не используется. Очень удобно. |
Цитата:
всё это сомнительно хорошо, пока не начнёшь модернизировать html ;) и ладно, если ты сам, а не для тебя :D |
:write:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <div> <!-- К этому элементу нужно прикрепить все мои события --> <script> $("script:last").parent().on("click", "a", function(){ alert("Клик 1"); }); </script> <a>Нажимаем</a> </div> <div> <!-- К этому элементу нужно прикрепить все мои события --> <script> $("script:last").parent().on("click", "a", function(){ alert("Клик 2"); }); </script> <a>Нажимаем</a> </div> |
Вы меня конечно извините, но по моему это говнокодинг. Лучше уж вешать события через HTML-атрибуты, вызывая тем самым нужную ф-цию.
|
Будьте добры обьяснить свой наезд с говнокодом. Лично мое мнение противоположное. Чем больше навешивается классов и идентификаторов, тем более атрибутов не по случаю тем больше это считаю говнокодом. Каждый, кто работает не разбирается почему висит тот или иной атрибут. Каждый предпочитает повесить свой. В итоге это превращается в месиво каждый из классов которых боишься убрать так как может что нибудь отвалиться. Говнокод это навешиваение на элемент не нужных идентификаторов. Зачем они если можно обойтись без них?.
Всегда считал функцию $(function(){ }) Обязательной. Читал, что это связано выполнением скрипта, что он должен выполняться после прогрузки всех элементов. А в коде выше jQuery код не обернут и тем самым выполняется по мере загрузки страницы. Есть какая нибудь принципиальная разница с оберткой или без? |
Цитата:
коду нужно не все элементы а те с которыми этот код работает ... поэтому в jquery решили лучше подождать пока все загрузятся, чтобы наверняка был элемент с которым кодер, хотел поработать, но хитрый кодер, наверняка сможет навесить функцию на несуществующий элемент, чтоб потом возмущаться почему ничего не работает :write: |
Цитата:
|
Если мы работаем с одним элементом. Мы все события вешаем только на один элемент. На родителя скрипта. То все остальные нам просто не к чему. Это уже дело самого скрипта. Привязка нужна только чтобы найти один единственный родительский элемент. На мой взгляд очень просто.
Крстати нашел тот глюк о котором упоминал в начала. Вот в таком скрипте <div> <script> (function($, script){ $(script).parent().on("click", "a", function(e){ var name = $(e.currentTarget).text(); alert(name); }).each(function(n, main){ console.log("main.outerHTML:", main.outerHTML); }); })(jQuery, document.scripts[document.scripts.length-1]) </script> <a href="">Клик</a> </div> main.outerHTML почему то нет содержимого ссылки. Блок просто пустой. Это также проявляется при поиске. Элементы просто не находятся. А мне они нужны при обработке. Изменить их при загружке. Кто знает почему? Странно. Здесь почему то выводит. Вот страница на которой пробую то же самое сделать и в ней нет содержимого. https://tiggy.ru/blockchain:test в ней нет ссылки <a href="">Клик</a> хотя она физически есть в блоке. Об этом глюке я говорил выше. Здесь можно посмотреть без шаблона то же самое https://tiggy.ru/blockchain:test/null на странице есть ссылка, а в выводе main.outerHTML ее нет. |
Это всетаки как то связано с загрузкой. При добавлении setTimeout все отобразилось. Хотя по логике сам jquery в обертке и должен загружаться уже после того, как все элементы прогружены. Получается, что даже с оберткой есть моменты, когда элементы прогружаются не полностью. Как в данном случае. Если загружать с интервалом или по нажатию, то все нормально. Как это можно обойти?
Как то так было бы отлично. Но опять же что то не работает. <div> <script type="text/javascript" src="//code.jquery.com/jquery-latest.js"></script> <script> (function($, script){ $(script).parent().on("click", "a", function(e){ var name = $(e.currentTarget).text(); alert(name); }).one("load", function(e){ console.log("main.outerHTML:", $(e.currentTarget).get(0).outerHTML); setTimeout(function(){ console.info("main.outerHTML setTimeout:", $(e.currentTarget).get(0).outerHTML); }, 100); }); })(jQuery, document.scripts[document.scripts.length-1]) </script> <a href="">Клик</a> </div> Событие }).one("DOMNodeInserted", function(e){ также не срабатывает. Такой вариант }).one(function(e){ тоже не работает. |
mpak,
какой load и e.currentTarget в load вы ждёте ?? |
mpak,
что хоть хочешь в коде сделать , что у тебя не работает? |
Цитата:
|
События click вешаются отлично. Это все заработало. Но нужно событие которое сработает после загрузки так как выше я написал что если сразу делать через each то элемент еще не прогрузился и в нем нет ничего посмотреть можно здесь https://tiggy.ru/blockchain:test/null первый вывод main.outerHTML: не содержит ничего, так как в элементе ничего нет поэтому и нужно событие, при котором прогрузится элемент и можно будет работать с его содержимым.
|
Для начала тебе самому нужно разобраться в том чего же ты хочешь добиться.
т.е. на отдельном листке бумаги нарисуй небольшую схемку что и в какой последовательности загружается что в этом момент запускается и что и после чего должно запустится =) |
Часовой пояс GMT +3, время: 03:35. |